Live data from Hacker News

If Web Components are so great, why am I not using them?

daverupert.com

81–90 of 189 posts

Re: If Web Components are so great, why am I not using them?

#81

The main reason is that they're too low-level to use directly. They do a lot, but stop just short of being useful without something of a framework on top. I tried hard to use them directly, but found that it was untenable without sensible template interpolation, and without helpers for event binding. Here's my shot at the smallest possible "framework" atop Web Components that make them workable (and even enjoyable) a…

Thanks for sharing, we need more libraries like this. Even htmx.org is 150kb library over what was a few lines of xhr + el.innerhtml=response.result 10 years ago.

Where is the next wave of tiny libs that can make the web feel responsive again?

Re: If Web Components are so great, why am I not using them?

#82
post #71

Earlier quoted context omitted.

We had HTML imports and they got rid of it. No JS means No Ads.

It means less invasive tracking really, not no ads. Ironically it was Firefox that killed it, not Google. Google was all in on HTML imports. It would have also given a non JS way to dynamically load HTML. Streaming would have been great with this.

HTML imports required JS to be used - otherwise all you had was a `link`ed DOM tree that you couldn't access. No one has really proposed a way to dynamically load anything without JS AFAIK.

Re: If Web Components are so great, why am I not using them?

#83
Frankly, web components aren't great.

I am using them, because I've landed in a few projects where adding a JS build step is too heavyweight for very minimal JS needs. But here are my gripes:

1. Templates are way too complicated to be useful. I have no idea what they were thinking here.

2. The shadow DOM not inheriting styles means I effectively can't use the shadow DOM for anything useful. My ideal use case would be that I could child elements to the current component into the shadow DOM. This allows me to do (for example) things like have a where the user can define child elements which in turn can contain arbitrary content: when the user selects a tab I copy the contents of the tag into the shadow DOM so that that's what becomes visible. But if I do that, the element content becomes unstyled. There are a bunch of really useful elements that are just completely blocked by this poor design choice. As a result, I just don't use the shadow DOM, but then I have to mutate the tabs to make them visible in place, and that means changes to the HTML of tabs can potentially cause issues for my and vice versa.

The first is a missed opportunity, but it's fairly easy to just not use them. The second problem is one of the worst API decisions I've ever seen, which would have been detected very quickly if anyone designing this API had been arsed to try to use their own API.

Re: If Web Components are so great, why am I not using them?

#85

The main reason is that they're too low-level to use directly. They do a lot, but stop just short of being useful without something of a framework on top. I tried hard to use them directly, but found that it was untenable without sensible template interpolation, and without helpers for event binding. Here's my shot at the smallest possible "framework" atop Web Components that make them workable (and even enjoyable) a…

meanwhile Im like... 1

Meanwhile I’m like… That’s a Content Security Policy violation.

Re: If Web Components are so great, why am I not using them?

#86

The main reason is that they're too low-level to use directly. They do a lot, but stop just short of being useful without something of a framework on top. I tried hard to use them directly, but found that it was untenable without sensible template interpolation, and without helpers for event binding. Here's my shot at the smallest possible "framework" atop Web Components that make them workable (and even enjoyable) a…

That approach destroys and rebuilds the entire DOM on every render. This would not work for large compound components and apps.

I've always wondered why this notion is so popular (is it just because of what react does)? Wouldn't the native browser be expected to handle a DOM re-render much more efficiently than an entire managed JS framework running on the native browser and emulating the DOM? Maybe in 2013 browsers really really sucked at re-renders, but I have to wonder if the myriads of WebKit, Blink, Gecko developers are so inept at their jobs that a managed framework can somehow figure out what to re-render better than the native browser can.

And yes, I understand that when you program using one of these frameworks your explicitly pointing out what pieces of state will change and when, but in my professional experience, people just code whatever works and don't pay much attention to that. In the naive case, I feel like the browser would probably beat react or any other framework on re-renders every time. In the naive case where developers don't really disambiguate what state changes like they're supposed to. Are there any benchmarks or recent blogs/tech articles that dive into this?

Re: If Web Components are so great, why am I not using them?

#87
I use custom elements directly in a bunch of stuff I had roll and I find the composition and reuse advantage nice. I tend to not bother with template elements, they don’t help much. I also don’t bother with shadow dom or element styles, as again, until you are making a mess with a distributed team you don’t actually have css problems. css also got a lot better at not causing problems, with fancier selectors and less problematic layout models.

People say they’re slow, but things I’ve hand rolled this way, while none are super complex, I can make thousands of elements and not put a dent in any metrics or lighthouse runs. I tend to bind stuff I’m going to manipulate in the child tree to variables in the constructor, so I never really have the cost of constant lookups, which maybe amortizes well once you’re looking at whole program performance.

Re: If Web Components are so great, why am I not using them?

#88
post #86

Earlier quoted context omitted.

That approach destroys and rebuilds the entire DOM on every render. This would not work for large compound components and apps.

I've always wondered why this notion is so popular (is it just because of what react does)? Wouldn't the native browser be expected to handle a DOM re-render much more efficiently than an entire managed JS framework running on the native browser and emulating the DOM? Maybe in 2013 browsers really really sucked at re-renders, but I have to wonder if the myriads of WebKit, Blink, Gecko developers are so inept at their…

I think the reason that the browser is so slow is that every time you mutate something, an attribute or add or remove an element, the browser rerenders immediately. And this is indeed slow AF. If you batched everything into a DocumentFragment or similar before attaching it to the DOM then it'd be fast. I don't know how you do that ergonomically though.

Re: If Web Components are so great, why am I not using them?

#89
There doesn't need to be a practical reason for something to not be popular. Popularity and merit are not the same thing.

Web components aren't popular because they haven't become popular yet. There is a lack of sufficient network effect moving in that direction.

Once they start becoming popular, the issues with them (which are relatively minor) will be resolved quickly and improvements added.

Why are most of our cities and cars still designed with fundamentals basically the same as in the 1930s? Not because there aren't better designs. It's just momentum.

High technology is like that still even though nothing physical needs to be changed.

Humans are herd animals. And the rationalization for behavior comes after the behavior not before. We subconsciously copy what other people are doing. People use React or whatever flavor-of-the-month.

Give it a couple of years and many of the flavor-of-the-month frameworks will probably be built on top of web components.

Re: If Web Components are so great, why am I not using them?

#90

Frankly, web components aren't great. I am using them, because I've landed in a few projects where adding a JS build step is too heavyweight for very minimal JS needs. But here are my gripes: 1. Templates are way too complicated to be useful. I have no idea what they were thinking here. 2. The shadow DOM not inheriting styles means I effectively can't use the shadow DOM for anything useful. My ideal use case would be…

The shadow DOM can inherit styles if you specify the styles that you want to inherit. Additionally, web components work just fine without the shadow DOM, it's optional, but for a great many custom elements you don't want them inheriting all the styles, because that can break the custom element.
Post reply on HN