WebComponents in 2023: A Comprehensive Exploration

A presentation at Devoxx Belgium in in Antwerp, Belgium by Horacio Gonzalez

For almost a decade now, we’ve been hearing about Web Components and their appealing promise of finally basing web development on a true component architecture, promoting reusability, modularization, and encapsulation. However, it is clear that today, in 2023, this promise is still not entirely fulfilled. Frameworks like React, Angular, and Vue continue to dominate the spotlight while the discourse around Web Components remains almost inaudible. Yet, Web Components are now present in many websites and applications we use every day, without us even noticing. The revolution is indeed underway, albeit rather quietly. In this lab, we will delve into the current evolution of Web Components, examining in detail the main libraries (Lit, Stencil, Hybrid…) and open-source component catalogs (Material, Lion, OpenUI5, Wired…) We will explore how different frameworks such as Svelte, Vue, and Angular have integrated and managed Web Components. The session aims to provide a comprehensive overview of strategies for creating reusable, framework-independent web components. We will also address common challenges, such as compatibility issues and Server Side Rendering (SSR) management, and the best practices and solutions for overcoming these problems.