What is the longest custom element name you have seen so far?
What is the longest custom element name you have seen so far?
Bulletproof web component loading
@leaverou These all power HTML in some way or other...
- Scoped Custom Element Registries
- Reference Target API
- elementInternals.type https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/ElementInternalsType/explainer.md
- Declarative CSS Modules and the adoptedstylesheets attribute https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/ShadowDOM/explainer.md
- Declarative Partial Updates https://github.com/WICG/declarative-partial-updates
- DOM Parts
- Platform based windowing/virtualization
- <tabs>
I've got lots more for CSS/JS if you get signed up for those.
Good luck with the survey!
Admin Bar Component got a tiny facelift this weekend and Iโd love to hear feedback. The point of this update is to make Admin Bar feel a little better on the page, instead of only full-width across the viewport.
Check out the new look here:
Here's a fun little CEM utility I threw together this weekend. It sorts CEM properties alphabetically and can also sort out deprecated properties.
This is helpful for documentation and producing a consistent CEM.
#WebComponents
https://wc-toolkit.com/cem-utilities/cem-sorter/
In custom elements, is it best to create one MutationObserver that handles every instance of the custom element or observers per instance, then set up and tear down the observer inside the custom element lifecycle? The target would be the custom element itself (or something within its shadow tree). #WebComponents #WebPerf
Admin Bar Component 1.5.4 is out!
In light of the Apple Glass stuff I learned about CSSโs `prefers-reduced-transparency` and applied it to the glassy background of Admin Bar Component.
The beta release of web awesome (formerly shoelace) is here and I am excited about all that cool web component stuff!
Created some tests for web components that retrieve a required design token value and check if the rendered elements have the equivalent computed value. For example, if the element is showing the correct values for a focus ring.
#webcomponents #testing #playwrite #css #designtokens #designsystems #a11y
#Development #Previews
Kelp ยท A customizable UI library that needs no build step https://ilo.im/164ypi
_____
#Library #HTML #CSS #WebComponents #CDN #WebStandards #WebDev #Frontend
Qu'est-ce que le shadow DOM ?
๐ https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_shadow_DOM
#Development #Proposals
Declarative templating API proposal ยท โThe time is right for a DOM templating API.โ https://ilo.im/164yqf
_____
#Templating #DOM #API #Frameworks #WebComponents #WebPlatform #WebDev #Frontend #HTML #JavaScript
Thinking about #vibecoding an implementation of #VRML in #webComponents
New blog post: building Web Components with Svelte, the easy way.
Read the piece here โก๏ธ https://mainmatter.com/blog/2025/06/25/web-components-with-svelte/?utm_source=mastodon&utm_medium=social&utm_campaign=25-06-26-blog-web-components-with-svelte
Bluesky Likes Web Components: "I set out to announce two components I wrote for displaying Bluesky likes and ended up ranting about the pain of building accessible, localizable #WebComponents in 2025. The components are still here, though โ lucky you?" https://lea.verou.me/blog/2025/bluesky-likes/
Web components compadres, what is your favorite way to style your web components? Thinking about techniques that consider customizability and CSS developer experience, as well as performance. Share with me your favorite libraries and tell me why you like their approach! #webcomponents #styling #designsystems
As promised, here is a post on subclassing `Event` to create truly custom #JavaScript events. I'm excited to explore this space a bit more for creating specialized events, not just for #WebComponents.
https://dev.to/stuffbreaker/creating-truly-custom-events-for-web-components-5bp5
The WC Toolkit Storybook Helpers for #WebComponents now support v9!!!
@bkardell @nomster Very interesting. Shares desires with a lot of discussions that have been happening in the #webComponentsCG as of late. Definitely see the super powers this could bring to both SPA AND MPA structures sites/applications. How can the community support moving something like this forward?
Svelte Without Svelte โ July 24
Love Svelte but stuck in React land? You donโt need to rewrite everything. This one shows how to bring Svelte in quietly and incrementally.
#Svelte #React #WebComponents #Mainmatter
๐งต5/5