World Congress 2025 Aug 20, 2025 Session details

Building a framework-independent component library

Tobias Scholz

Ditch endless UI rewrites and break free from framework lock-in. Build a resilient, framework-independent component library using native browser APIs and Lit.

Pause
Mute Enter Fullscreen
#1 about 2 min

The challenges of multiple frontend technology stacks

Using different frameworks on the same site often leads to styling inconsistencies.

#2 about 2 min

What are web components and custom elements

Custom elements extend standard browser elements through dedicated JavaScript classes defining native-like behaviors.

#3 about 2 min

Comparing light DOM and shadow DOM encapsulation

Encapsulating styling within a shadow document object model prevents cascading style sheet conflicts globally.

#4 about 4 min

Live coding vanilla web components without libraries

Setting up custom elements manually involves bootstrapping nodes, attaching shadow roots, and manually registering tags.

#5 about 2 min

Simplifying component development with Vite and Lit

Adopting modern bundlers and structural wrappers significantly streamlines custom element creation.

#6 about 4 min

Comparing vanilla web component code to Lit implementations

Extending a dedicated library automatically handles underlying template rendering and improves syntax ergonomics.

#7 about 3 min

Wrapping legacy external components for slow migrations

Encapsulating purchased third-party widgets allows incremental migrations while maintaining consistent visual styling locally.

#8 about 2 min

Building interactive component documentation pages with Storybook

Interactive documentation platforms empower engineers to test component parameters and quickly copy integration code.

#9 about 3 min

Real-world web components in the Carbon design system

Reviewing an open source enterprise repository demonstrates how complex open UI libraries scale with standardized technologies.

Matching moments

7:10 min

Building framework-less architectures with native custom web components

Christian Liebel Christian Liebel · WWC 2022

4:23 min

Building a framework-agnostic design system with web components

Manuel Mauky · WWC 2023

4:56 min

Understanding standard technologies behind web component architecture

Manuel Mauky · WWC 2023

5:59 min

Integrating web components across popular javascript frameworks

Rowdy Rabouw Rowdy Rabouw · WWC 2022

3:46 min

The rise of modern component-based frameworks and modular architecture

Sasha Shynkevich · LIVE

48 sec

Exploring alternative build tools and experimental web components

Sasha Shynkevich · LIVE

Upcoming sessions on this topic

Open session

World Congress 2026 North America

Beyond Vibe Coding: An AI Builder’s Guide to Migrating 10k+ React Components

Shubham Chaurasia

Senior Software Engineer @ Meta

Shubham Chaurasia
Open session

World Congress 2026 North America

Architecting AI in Angular: WebMCP, A2UI, and the Agent Experience

Ankita Sood

Sr. Principal Engineer @ Secureworks | Angular GDE

Ankita Sood
Open session

World Congress 2026 North America

When Humans Stop Writing Code: Rethinking Languages, Compilers, and Responsibility

Simon Auer

Organizer of flutter vienna meetup and CEO of marqably

Simon Auer
Open session

World Congress 2026 North America

Small LLM in your Browser: Huge Opportunities for Web Applications

Daniel Ostrovsky

UI/UX Architect at Payoneer | AI Architect | Full Cycle Development Expert | Public Speaker | Open Source Contributor |

Daniel Ostrovsky
Open session

World Congress 2026 North America

Beyond Vibe Coding: Using CLI Tools as Your AI Counterpart in Pair Programming

Ron Veen

Java enthusiast and Special agent for Team Rockstars IT

Ron Veen
Open session

World Congress 2026 North America

Full Stack with Flutter - are we there yet?

Nemanja Stošić

Senior Flutter Developer

Nemanja Stošić