Web Components and WebC tool offer alternatives to JS frameworks

Web Components and new tooling like WebC are gaining attention as alternatives to complex JavaScript frameworks. WebC, a tool developed by Eleventy, functions as a standalone generator for markup for custom elements and Web Components. It enables server-side rendering for Web Components and provides features such as CSS scoping, critical CSS and JS bundling, and progressive enhancement.

Web Components themselves rely on three core technologies: Custom Elements, Shadow DOM, and Templates and Slots. The Shadow DOM allows for an encapsulated tree to be attached to an element, keeping features private to prevent collisions with the main document DOM. Slots serve as a mechanism to bridge the Light DOM and the Shadow DOM, allowing content from the web page to be projected into the component.