Note

The project is now in SourceHut. Please submit issues or requests via our Todo Page or via email.

Web Component Base

🤷‍♂️ zero-dependency, 🤏 tiny JS base class for creating reactive custom elements easily ✨

When you extend the WebComponent class for your component, you only have to define the template and properties. Any change in any property value will automatically cause just the component UI to render.

The result is a reactive UI on property changes.

There's a trade off between productivity & lightweight-ness here, and it is somewhere between Microsoft's FASTElement & Google's LitElement.

Links

• Documentation
• Main Repo at SourceHut
  • GitHub Mirror
  • ...more mirrors coming
• To Do
• Read a blog explaining the reactivity
• View demo on CodePen

Want to get in touch?

There are many ways to get in touch:

1. Email a ticket: ~ayoayco/[email protected]
2. Submit via SourceHut todo
3. Start a GitHub discussion
4. Email me: [email protected]
5. Join via Discord: Ayo's Projects

Inspirations and thanks

1. htm - I use it for the html function for tagged templates, and take a lot of inspiration in building the rendering implementation. It is highly likely that I will go for what Preact is doing... but we'll see.
2. fast - When I found that Microsoft has their own base class (super cool!) and I thought: okay, I don't feel bad about forgetting Lit exists now
3. lit - lit-html continues to amaze me and I worked to make wcb generic so I (and others) can continue to use it