Web Components and the future of web frameworks

Carlos Morales • 2019-05-16

I believe Web Components is the future of the web and will replace other web frameworks. I split the post answering these questions:

• Why web frameworks appeared?
• Why Web Components will replace them?
• Where to start?

Web Frameworks

When I started building websites back in 1998, the JavaScript code was really simple, we barely used it only for form validations. It was not until 2006 and the standardization of XMLHttpRequests (at that time known as Ajax programming) when JS usage did not take off.

Since then, web applications became more rich and more complex. Gmail from Google and other web applications were pushing the users’ expectation. Reloading constantly the whole page was no longer acceptable, web applications started retrieving data in the background without refreshing the page.

At that time jQuery (which is still one of the most broadly used web frameworks) was extremely useful, it allowed developers to “easily” create and replace parts of the DOM without reloading the whole page. Single-page applications (SPA) were born :birthday:.

After jQuery many web frameworks appeared. They all try to resolve the same: help developers to produce rich web applications. Except jQuery, all web frameworks (Angular, React, VueJS, etc.) mainly focus on providing composable view components, this pattern allows developers to modularize the logic in reusable parts.

Web Components are the future

Web Components are a group of W3C standards for creating self-contained, reusable widgets in HTML. Complex components can be bundled together to create a clean, functional UI in a short amount of time.

jQuery was useful for a specific reason, the web platform evolved and these JS frameworks appeared to help developers. The web is continuously evolving and at some point these JS frameworks will no longer be needed as W3C standards are slowly catching up.

Web Components provide a native component model for the Web. This allows us to create reusable elements as web frameworks do, except Web Components are native. This translates into best performance :1st_place_medal:.

The bottom line with web frameworks is that we sacrifice user experience for developer experience.

Web Components reading list

After researching the topic, I realized there is plenty of documentation out there, because I won’t do a better job than them, here is my recommended reading list:

• An introduction to Web Components is a series of articles that describe these separate technologies that together make Web Components available in the web.
• Google has also a good set of articles in their developer portal that also describe the technologies. I particularly like the best practices checklist.
• The W3C list of specification standards is the perfect reference, although these may be harder to consume.
• Finally, a long entry level tutorial for Web Components.

Happy reading :blush::books:!!