I thought the Bytes newsletter #326 did a good job of showing the different between a “normal” web component and a “declarative shadow DOM” web component. (Quick ports of the former and latter). Declarative shadow DOM is the web components story for “server-side rendering” (SSR). All the visual stuff needed to render the component is in the HTML, then JavaScript loads later and wires it all up. Literally the same as hydration. I’ve heard “where is the Next.js of web components?” and I tend to think declarative shadow DOM is one of the major primitives required to get there.
Featured
How to Add and Remove Items From a Native CSS Carousel (…with CSS)
It’s already quite impressive you can build a carousel with no JS at all (in Chrome, for now, anyway) and with some checkbox-hack stuff we can control dynamically what is shown.