Postřehy k Webovým komponentám
Článek sdružující záložky, které jsem si poznamenal (před rokem 2023 – tj. možná neaktuální!).
Obsah
V tomto příspěvku se podíváme na několik zajímavých projektů a myšlenek týkajících se webových komponent. Nejprve se zaměříme na nástroje a frameworky, které nám mohou usnadnit práci s webovými komponentami, a poté se podíváme na některé kritické postřehy a návrhy na zlepšení.
Nástroje a frameworky
uce-template
uce-template je nástroj inspirovaný Vue 3 pro tvorbu webových komponent bez použití buildovacích nástrojů. Více informací naleznete v článku od Andrea Giammarchi.
qwc
qwc nabízí rychlé a jednoduché vytvoření webových komponent. K definování se používají template a objekty.
haunted
haunted nabízí možnost definovat webové komponenty alá ReactJS.
Kritické postřehy a návrhy na zlepšení
Kolize požadavků na CSS
U webových komponent narážíme na problém sdílení CSS a zároveň jejich odstínění, viz např. diskuze Web components should be able to easily adapt to the host page while maintaining enapsulation · Issue #986 · WICG/webcomponents.
Tento příklad z vanilla-web-components ukazuje, jak použít sdílené CSS s webovými komponentami.
The failed promise of Web Components
Lea Verou ve svém příspěvku kritizuje slib webových komponent a uvádí, že potřebujeme lepší způsoby, jak řešit jejich nedostatky.
html-syntax-guidelines
V html-syntax-guidelines Lea Verou shrnuje zásady a doporučení pro psaní čistého a srozumitelného HTML kódu.
Declarative Custom Elements Strawman
Tento návrh z WICG se zabývá deklarativním způsobem definování webových komponent.
observed-state
observed-state je demo, které ukazuje, jak lze implementovat správu stavu pomocí uce-template.
K dalšímu zkoumání
Související GitHub repozitáře se snažím shraňovat zde 🌐 HTML/DOM/Web Components.