JavaScript Webcomponents

Open-source JavaScript projects categorized as Webcomponents

Top 23 JavaScript Webcomponent Projects

  • riot

    Simple and elegant component-based UI library

    Project mention: Button Component with RiotJS (Material Design) | dev.to | 2024-03-23

    These articles form a series focusing on RiotJS paired with BeerCSS, designed to guide you through creating components and mastering best practices for building production-ready applications. I assume you have a foundational understanding of Riot; however, feel free to refer to the documentation if needed: https://riot.js.org/documentation/

  • onsenui

    Mobile app development framework and SDK using HTML5 and JavaScript. Create beautiful and performant cross-platform mobile apps. Based on Web Components, and provides bindings for Angular 1, 2, React and Vue.js.

    Project mention: React Component Libraries | dev.to | 2024-03-13

    Official Website: https://onsen.io/

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  • hybrids

    Extraordinary JavaScript UI framework with unique declarative and functional architecture

  • lwc

    ⚡️ LWC - A Blazing Fast, Enterprise-Grade Web Components Foundation

    Project mention: lwc.dev | /r/SalesforceDeveloper | 2023-07-11

    Actually I was wondering if lwc oss is still a thing. The website lwc.dev looks like it hasn't been updated since the release in 2019. Are many people using it or was it a nice try by Salesforce but can we consider it dead? I know of course it can't compete with react, vue or angular, but has it built a nice user base around it to keep it interesting?

  • Odoo

    Javascript and SVG odometer effect library with motion blur

  • reactive-elements

    Allows to use React.js component as HTML element (web component)

  • react-svg-pan-zoom

    :eyes: A React component that adds pan and zoom features to SVG

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  • vaadin

    An evolving set of open source web components for building mobile and desktop web applications in modern browsers.

  • jTools - Javascript web components

    jSuites is a collection of lightweight common required javascript web components. It is composed of fully responsive vanilla plugins to help you bring the best user experience to your projects, independent of the platform. Same JS codebase across different platforms.

  • snuggsi

    snuggsi ツ - Easy Custom Elements in ~1kB

    Project mention: Snuggsi ツ – Easy Custom Elements in ~1kB | news.ycombinator.com | 2023-06-16
  • web-components

    A set of high-quality standards based web components for enterprise web applications. Part of Vaadin 20+

    Project mention: Creating Custom Component for NPS Feedback | dev.to | 2023-04-30

    Component UX. Do you need keyboard navigation? Mouse hover? Shortcuts? I suggest staying safe, combining existing components, and making your custom solutions sparingly.

  • 11st-starter-kit

    11ty, powered by Vite with Tailwind CSS and Alpine.js.

  • urdf-loaders

    URDF Loaders for Unity and THREE.js with example ATHLETE URDF Files open sourced from NASA JPL

  • zero-md

    Ridiculously simple zero-config markdown displayer

  • panel

    Web Components + Virtual DOM: web standards for powerful UIs (by mixpanel)

    Project mention: Web Components Will Outlive Your JavaScript Framework | news.ycombinator.com | 2023-10-25

    Webcomponents will outlive React 13, mostly likely. Will they outlive React entirely or its cousins like Solid and Svelte? Perhaps not.

    Webcomponents and React look like they solve the same problem but they do not.

    Webcomponent api is pretty shallow. You get connected/disconnnected/attributeChanged call back but gotta write your own property setter and getters, and that’s mostly it. Shadow dom becomes a pain to work with if something needs to pierce it. Can’t pass nested objects in attributes, gotta encode as string.

    Mixpanel went all in on webcomponents, but had to build a whole bunch of lib tooling around it. They made their own framework on top of webcomponents. https://github.com/mixpanel/panel

    Worked on panel lib and webcomponent UI for many years. It is not a silver bullet.

    The issue with webcomponents is there are a ton of libraries that fill in the missing gaps. There’s not a lot you can do with pure vanilla webcomponent api since browsers don’t provide efficient dom updating mechanism. Google has their own thing, Microsoft had multiple internal libs across orgs, Reddit does their own thing.

    The most standard thing for frontend with wide adoption right now is React.

    So the way I see it, is that React has already outlived webcomponents.

  • lrnwebcomponents

    HAXTheWeb monorepo of elements and apis

  • custom-elements-manifest

    Custom Elements Manifest is a file format that describes custom elements in your project. (by open-wc)

  • patterns-library

    AXA CH UI component library. Please share, comment, create issues and work with us!

  • github-wc-polyfill

    Ensure that all GitHub and GitLab scripts required for UXP and SeaMonkey are loaded correctly

  • greenwood

    Greenwood is your full-stack workbench for the web, focused on supporting modern web standards and development to help you create your next project.

  • symbiote.js

    Simple, light and very powerful library to create embedded components for any purpose, with a data flow management included.

    Project mention: Symbiote.js 2.0 | dev.to | 2024-01-17

    Thanks for your attention, and don't be sorry for the stars on GitHub, developers will be very pleased to know that they are not “screaming into the void.”

  • palefill

    Inject Polyfills for various web technologies into pages requiring them

    Project mention: Have you guys ever heared about this one? Mercury. Its from the creator of Thorium, an optmized version of Firefox. | /r/browsers | 2023-12-08

    It cannot render modern sites without a polyfill addon to improve compatibility because they are worried more about legacy extensions and an old UI than providing a usable browser https://martok.github.io/palefill/

  • webcomponent-instagram-widget

    🖼 Simple Instagram Widget: Photos Box of your Instagram Profile for your blog or website with this WebComponent.

  • WorkOS

    The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2024-03-23.

JavaScript Webcomponents related posts

Index

What are some of the best open-source Webcomponent projects in JavaScript? This list will help you:

Project Stars
1 riot 14,830
2 onsenui 8,788
3 hybrids 2,964
4 lwc 1,561
5 Odoo 814
6 reactive-elements 698
7 react-svg-pan-zoom 672
8 vaadin 543
9 jTools - Javascript web components 483
10 snuggsi 393
11 web-components 387
12 11st-starter-kit 373
13 urdf-loaders 372
14 zero-md 343
15 panel 271
16 lrnwebcomponents 236
17 custom-elements-manifest 204
18 patterns-library 120
19 github-wc-polyfill 101
20 greenwood 90
21 symbiote.js 84
22 palefill 77
23 webcomponent-instagram-widget 77
The modern identity platform for B2B SaaS
The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.
workos.com