Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

HTML with Superpowers: An Introduction to Web Components

htmlwithsuperpowers.netlify.app

Post reply on HN
Print view View original

41–50 of 130 posts

Re: HTML with Superpowers: An Introduction to Web Components

#41

Post by dmitriid »

claytongulick wrote: post #7
lordgroff wrote: post #3

It obviously hasn't happened, but I hope that web components eventually make serious inroads. A UI library for React, Vue, Svelte, Solid, whatever... Imagine being able to have a component library that works with any of them (or none of them). Since I really like mithril and there's one UI library, I've been playing with Shoelace and Crayons and they're pretty nice to work with, but I remain a bit puzzled why there's…

Stencil and consequently Ionic are all Web Component based. Svelte fully supports compiling to Web Components with 100% test coverage. Vue fully supports Web Components as well, the only issue I've run into there is with CustomEvent.detail not being copied into the Vue event payload properly. Web Components are widely used on the web, just under the covers sometimes.

Svelte will remove compiling to web components into a plugin.

In general, none of the major frameworks, and very few of the new frameworks use web components as a foundation for their functionality for many extensively described reasons that wc proponents literally couldn't care less about.

Re: HTML with Superpowers: An Introduction to Web Components

#42

Post by nathias »

Web Components are a good concept but the implementation is terrible even as designed. OOP JS is itself terrible, but the end result are files of thousands of lines where vanilla JS + html would require just a few. I'm currently working with lit, Web Components and TS and it feels like coding C# or Java.

Re: HTML with Superpowers: An Introduction to Web Components

#43

Post by dmitriid »

misterbwong wrote: post #34

Web components have their place but they're no panacea and the ecosystem is still pretty young. This is coming from someone that has been leading a decently large StencilJS web component project for over a year now. Documentation and Google-ability of the subject isn't great so prepare to some digging and experimentation. The current native feature set is somewhat lacking so you're definitely going to want to augment…

> Web components have their place but they're no panacea and the ecosystem is still pretty young.

And yet wc proponents keep pushing them as if they were panacea.

And "ecosystems is young" is a funny statement for something that is entering its 12th year of development (and fifth year of wide availability in browsers).

> The current native feature set is somewhat lacking so you're definitely going to want to augment with some sort of helper framework/library.

If they are lacking, have glaring unsolved issues, https://twitter.com/Rich_Harris/status/1198332398561353728), and you still need to augment them with a framework/library,... what's the point then?

If any of the existing solutions had the same amount of issues that wcs have, they would never have gotten of the ground. And yet here we are 12 years and hundreds of millions of dollars of effort later

Re: HTML with Superpowers: An Introduction to Web Components

#44

Post by dmitriid »

Keithamus wrote: post #38
misterbwong wrote: post #34

Web components have their place but they're no panacea and the ecosystem is still pretty young. This is coming from someone that has been leading a decently large StencilJS web component project for over a year now. Documentation and Google-ability of the subject isn't great so prepare to some digging and experimentation. The current native feature set is somewhat lacking so you're definitely going to want to augment…

I’ve been working on https://webcomponents.guide/ with some fellow experts in order to improve the documentation side of things. Hoping to offer guidelines and best practices to limit the amount of searching and experimentation required. Please take a look and provide feedback if you can!

That marketing copy ugh.

"New! Powerful!" It's neither

"Standard JS so it works where HTML works" says a lot about your experts

Re: HTML with Superpowers: An Introduction to Web Components

#45

Post by dmitriid »

qwtel wrote: post #22

Just awful. 10 years in the making (if you can call endless bikeshedding committee meetings the "making" of anything) and still barely usable. It offers nothing in way of ensuring that custom elements behave like builtin HTML elements. Half the elements I've come across will break or perform no-ops when you update an attribute or set a propety after it was attached to the DOM. Nevermind detaching and reattaching to t…

> faster than the bikeshedding commissars from goog and aapl can agree on whether "open" or "closed" should be the default for attaching a shadow DOM

Because very few of the people developing web standards are web developers. And of those who are very few have done anything of note in the past 20 years or more.

They do love working on standards though.

Re: HTML with Superpowers: An Introduction to Web Components

#46

Post by azangru »

pjmlp wrote: post #39
qwtel wrote: post #22

Just awful. 10 years in the making (if you can call endless bikeshedding committee meetings the "making" of anything) and still barely usable. It offers nothing in way of ensuring that custom elements behave like builtin HTML elements. Half the elements I've come across will break or perform no-ops when you update an attribute or set a propety after it was attached to the DOM. Nevermind detaching and reattaching to t…

Thanks to React, everyone else already has Web Components support built-in.

This is wrong on so many levels :-) As of now, React is probably the only major frontend framework that doesn't interop well with web components, requiring various hacks for doing so. Proper support is hopefully coming in version 19. What you have with React is its own, React-specific way of encapsulating parts of UI into stateful functions that helps to think about them as components.

And to have web components support built-in would mean to have them in the browser anyway, not in a third-party library.

Re: HTML with Superpowers: An Introduction to Web Components

#47

Post by azangru »

dmitriid wrote: post #43
misterbwong wrote: post #34

Web components have their place but they're no panacea and the ecosystem is still pretty young. This is coming from someone that has been leading a decently large StencilJS web component project for over a year now. Documentation and Google-ability of the subject isn't great so prepare to some digging and experimentation. The current native feature set is somewhat lacking so you're definitely going to want to augment…

> Web components have their place but they're no panacea and the ecosystem is still pretty young. And yet wc proponents keep pushing them as if they were panacea. And "ecosystems is young" is a funny statement for something that is entering its 12th year of development (and fifth year of wide availability in browsers). > The current native feature set is somewhat lacking so you're definitely going to want to augment…

Examine html source of such sites as github, youtube, redhat, adobe — you will find web components either sprinkled there or being a principal building block. They are certainly a workable solution.

Re: HTML with Superpowers: An Introduction to Web Components

#48

Post by dmitriid »

Everyone (me included) is discussing web components, and no one is discussing the contents of the site itself:

- extremely light on content

- goes out of its way to not present anything more complex than non-functional pieces of code or static examples

- while advertising that they are "easy to use", the Writing section immediately skips to comparing and using frameworks and libraries

- I guess is a front to get the courses at $39/month, but the only link is on the front page

This is a horrible, bad, no good resource that offers nothing of value.

Re: HTML with Superpowers: An Introduction to Web Components

#50

Post by globalise83 »

Have been using Stencil.js extensively in recent months, and after understanding how it works, I find it a viable and indeed preferable alternative to using react. It has functional components, uses JSX, is based on top -> bottom propagation of state etc., but outputs a web component library that can be used without any dependencies except for the JS script tag.
Post reply on HN