If all the open source components I used all used preact, I wouldn't be concerned about the 3kb. But if each component author uses a different framework or even a different version of a framework, it quickly becomes something like 3kb * number of components.
True, but what I meant to say is that there is nothing revolutionary. It's not providing capabilities that we didn't have before. It's simply establishing a standard for a tiny subset of what a modern web framework does- roughly equivalent to those 3kb of code- by doing the equivalent of incorporating it natively inside the browser.
Yes, now you can use components without a framework (you could use them without a build step also before). But if you want to do anything more complex than a static page with jquery, you still need both.
To me it feels like the dream of 2005. It's cool, but we've been able to do the same for at least ten years at this point, and with the tools of our choice.
The big thing web components solve is interoperability. How do you use a preact component inside an angular app? How do you use an angular component inside a vue app?
Web components are the solution. No matter what library or framework or whatever that you're using, you can render a <div> so you can render a <my-component>. That combined with shadow dom means that the element's internals and its styles are encapsulated, so that you can drop it into a page and it won't mess up the rest of the page and the page can't mess it up.
This is particularly valuable for a design system, because a company will have a design and want their web properties to look consistent, but they'll have one app written with angular, and another couple with react, and a few ancient apps written with jquery. You could either convert _everything_ to the latest and greatest thing, or you could write your design system with web components, and it'll work everywhere.
