The Failed Promise of Web Components

Because then you don't have to pass a huge framework library down the wire along with all of your custom code? Look at it the other way, if you don't get a big advantage over web components by using React, Svelte, etc then why would you use them? Web components are natively supported by modern browsers. Using a fairly simple base class like Lit-Element to provide some template niceties and lifecycle hooks gives us all the extras we need. We've figured out a really nice top-down functional state pattern for data that eliminates the need for two-way binding and requires very little "framework" level code - it's probably like 100 lines if you take out whitespace and comments.

Just to set the record straight, here's why I mentioned it:

I like her writing style. She writes in a pithy vernacular that belies her educational credentials.

She writes like a cranky old man (takes one to know one). I think we need more writing like that, as opposed to the usual buzzword bouillabaisse that makes up a significant chunk of the tech WordSphere.

When someone writes like that, it can be easy to dismiss (I know this). I didn't know about her, or her creds, and was pleasantly surprised, when I read them, so I figured I'd share my pleasure and surprise.

I encourage highly-skilled, -experienced, -educated, -whatever folks to write in an accessible fashion; preferably, with warmth, humor and approachability. The world needs as much of that as possible.

I could really care less whether or not she is a woman. It probably means a lot more to her, than it does to me. I enjoyed her work, and my enjoyment was improved, when I learned her background, and expressed my pleasure.

I mean, why the heck do we always have to find things wrong with everything? Can't we just say "This is cool. I'd like to hold it up as an example of what I like."?

> Here's what killed web components: lack of native databinding on the web

"Modern Frameworks like React/Vue/Angular and Web Components are built to solve different problems. Web Components provide strong encapsulation for reusable components, while Frameworks provides a declarative library that keeps the DOM in sync with your data. The two goals are complementary. As a developer, you are free to use a Framework in your Web Components, or to use Web Components in your Framework, or both."

https://reactjs.org/docs/web-components.html

I have a side project for selling reusable HTML blocks/sections, some people advised me to convert it into Web Components since it can be reused between different Frameworks (React, Vue, Angular, etc) at the same time.

After reading this discussion, I think we should build a native components for each Framework.

I always saw WCs as the leaves to the root that CSS frameworks already offer.

You can drop in Bootstrap and the whole page looks nice, but the moment you want to use the GUI elements that consist of multiple HTML tags, things get ugly.

WC would offer a way to merge these into one element.

Then you could drop your JS framework of choice in the middle and be done with it.

React isn't cool anymore? Well, at least you can take Bootstrap and its WCs with you. I had the impression CSS frameworks had a longer half-life than their JS counterparts anyway.

I don't really care about all that HTML module stuff or JS requirements. Sure would be cool if things were different, but from a practical POV it doesn't seem THAT important to me.

> I can only assume there's some fundamental implementation roadblock I'm missing.

Current low level DOM API has something that fancy reactive data binding techniques will never have: ability to efficiently be used for an extremely wide range of data binding techniques and philosophies.

You go ahead and require implement something like virtual DOM as a standard, then what is everyone who doesn't want virtual DOM, or even this particular flavor of virtual DOM supposed to do? Virtual DOM designs are high level and not extensible. That is not something we need to be forced onto us for decades to come.

That might be hard to understand if you like React and its virtual DOM, and assume something like that will be made the standard, and will remain in fashion forever. How about: Angular v1 bindings are now the standard built into the DOM. How do you feel about that? That's how standardized virtual DOM will feel like in 10-20 years even to those who like it today. No matter what kind of data binding design you choose, React, Angular, some variation of observables or what, it will suck for a lot of people, and increasingly so as time goes by and fashions change.

Data binding is a solved problem on the frontend. It's just solved by libraries in many different ways depending on the developer's preferences. There is nothing wrong with that. The long term cost to centralizing all this diversity into a single opinionated high level API blessed by W3C is completely unacceptable. The low level API is working just fine today.