Still waiting for declarative (JS free) support in all browsers.
HTML with Superpowers: An Introduction to Web Components
31–40 of 130 posts
Re: HTML with Superpowers: An Introduction to Web Components
#32I evaluated web components a few months ago. Everything was great except event propagation. Let’s say I have a component which is a DIV that wraps a label and an input. How can a consumer listen to the onchange event of the component which should map to the inputs onchange event. I could never come up with a holistic solution that would work for all components. It’d require a lot manual work mapping the input event t…
That's handled by shadow dom event retargeting. When the events pass over the boundary of the component the target becomes the component itself instead of the input.
Re: HTML with Superpowers: An Introduction to Web Components
#33Just awful. 10 years in the making (if you can call endless bikeshedding committee meetings the "making" of anything) and still barely usable. It offers nothing in way of ensuring that custom elements behave like builtin HTML elements. Half the elements I've come across will break or perform no-ops when you update an attribute or set a propety after it was attached to the DOM. Nevermind detaching and reattaching to t…
There's also a lack of standard server-side-rendering support. From last I looked at it, some of the web component libraries have their own SSR support, but that only works with web components authored with that specific library, negating the supposed universal compatibility of web components, and they involve using heavyweight simulated DOM libraries on the server. I'm not going to bother with something that doesn't…
Take a look at Declarative Shadow DOM: https://github.com/mfreed7/declarative-shadow-dom
This is basically the SSR spec for web components.
Re: HTML with Superpowers: An Introduction to Web Components
#34Web components have their place but they're no panacea and the ecosystem is still pretty young. This is coming from someone that has been leading a decently large StencilJS web component project for over a year now.
Documentation and Google-ability of the subject isn't great so prepare to some digging and experimentation.
The current native feature set is somewhat lacking so you're definitely going to want to augment with some sort of helper framework/library. Building any significantly sized project purely native with vanillaJS would be challenging.
There are also some unique hurdles with this type of project that our org had to work through-mainly on the integration and design side of it.
Re: HTML with Superpowers: An Introduction to Web Components
#35Lack of ruins web components. Still need js to go fetch your component if you want it in a separate file. So you end up having to use webpack or whatever. Sigh.
Re: HTML with Superpowers: An Introduction to Web Components
#36Earlier quoted context omitted.
What do you mean? There are tons of these around. Are you complaining that none of them are popular enough?
None of them are standard. It should be baked into the cake. It's been a puzzler to me since I started programming over 20 years ago. Every third-party library existed basically just to provide a usable grid because most everything else was good enough. Combo boxes and date pickers too but those were less of a pain to implement.
There's various bits and pieces around the margins of grid/table/sorting that make it so it doesn't surprise me that it's not natively provided.
But the lack of a combobox in HTML, I don't get at all. datalist kind of sort of does it but not quite, plus it's inconsistently implemented as to what it actually shows.
Re: HTML with Superpowers: An Introduction to Web Components
#37One of the problems with native encapsulation is that UI frameworks almost never fully satisfy the product requirements for a given application, so in some cases it’s always necessary to override either behavior or styling. If you remove that capability with a shadow DOM, you damn well better be sure that your abstraction is perfect.
That’s what CSS parts and slots are for. Your component can style its own boundaries, provide parts to allow customisation, and use slots to inject components that are styled from outside (be it another ShadowDOM or the light DOM)
Re: HTML with Superpowers: An Introduction to Web Components
#38Web components have their place but they're no panacea and the ecosystem is still pretty young. This is coming from someone that has been leading a decently large StencilJS web component project for over a year now. Documentation and Google-ability of the subject isn't great so prepare to some digging and experimentation. The current native feature set is somewhat lacking so you're definitely going to want to augment…
I’ve been working on https://webcomponents.guide/ with some fellow experts in order to improve the documentation side of things. Hoping to offer guidelines and best practices to limit the amount of searching and experimentation required. Please take a look and provide feedback if you can!
Re: HTML with Superpowers: An Introduction to Web Components
#39Just awful. 10 years in the making (if you can call endless bikeshedding committee meetings the "making" of anything) and still barely usable. It offers nothing in way of ensuring that custom elements behave like builtin HTML elements. Half the elements I've come across will break or perform no-ops when you update an attribute or set a propety after it was attached to the DOM. Nevermind detaching and reattaching to t…
Thanks to React, everyone else already has Web Components support built-in.
Re: HTML with Superpowers: An Introduction to Web Components
#40Web components have their place but they're no panacea and the ecosystem is still pretty young. This is coming from someone that has been leading a decently large StencilJS web component project for over a year now. Documentation and Google-ability of the subject isn't great so prepare to some digging and experimentation. The current native feature set is somewhat lacking so you're definitely going to want to augment…
I’ve been working on https://webcomponents.guide/ with some fellow experts in order to improve the documentation side of things. Hoping to offer guidelines and best practices to limit the amount of searching and experimentation required. Please take a look and provide feedback if you can!
No amount of documentation will help if React keeps acting as if Web Components don't exist.
Other than that, the website looks quite nice.