The Future of Frameworks

Love them or hate them, web components ("custom elements") are making a huge dent in the world of front-end development. As of today, close to 18% of page views in Chrome are registering web components. That's an insane amount of usage!

The benefits of a framework-agnostic component model are becoming obvious to web developers, particularly those who have built the same components over and over again to accommodate various framework flavors. That kind of rework is a time sink that inevitably leads to visual and functional inconsistencies. Maintaining multiple versions of the same component isn't a winning strategy for developers, designers, or end users.

Web components solve this problem not by replacing frameworks, but by complementing them with a standardized component model. Create your lower-level building blocks as custom elements, then plug them into a framework that handles higher-level operations. When it's time to upgrade or switch frameworks, you can do it more easily because you don't have to rip out the foundation and rebuild everything from scratch. Interoperability is why web component-based design systems are so appealing to large organizations.

My prediction is that front-end frameworks will move away from proprietary component models and embrace custom elements as first-class citizens. Both Vue and Svelte provide mechanisms for authoring them — although they still use and support their own component models as well.

"But I don't plan on switching frameworks!"

Unlike diamonds, frameworks aren't forever.* They come and go and, as their popularity fades, so does support, contributions, and community interest. Contrast this to web standards that browsers commit to supporting without breaking changes.

We've been building and rebuilding buttons for years because the component model has been baked into our frameworks. We don't need to do that anymore. If longevity is a goal, custom elements are where it's at.