image

Web component libraries

Libraries for building web components

Web Components consist of three separate technologies that are used together:

  • Custom Elements: Quite simply, these are fully-valid HTML elements with custom templates, behaviors and tag names made with a set of JavaScript APIs.
  • HTML templates: User-defined templates in HTML that aren’t rendered until called upon
  • Shadow DOM: Capable of isolating CSS and JavaScript

Stencil

image

stenciljs.com

Stencil is a toolchain for building reusable, scalable Design Systems. Generate small, blazing fast, and 100% standards based Web Components that run in every browser.

Polymer

image

www.polymer-project.org

Libraries, tools, and standards for a better web: LitElement, lit-html, web components

LitElement

image

github.com

LitElement uses lit-html to render into the element's Shadow DOM and adds API to help manage element properties and attributes

Hybrids

image

hybrids.js.org

Hybrids is a UI library for creating web components with unique declarative and functional approach based on plain objects and pure functions.