Shadow Dom is not only about styles, here's some of the problems it solves at ionic: (thread)
-
Show this thread
-
It sets a stronger contract between us and the final users. It allow us to continue innovating without breaking changes. Our users use CSS vars to fully customize the components while we have the flexibility to completely refactor how it works from the inside.
2 replies 1 retweet 11 likesShow this thread -
Consistent rendering (like iframe) but lightweight, external styles can not break the component. This problem is not solved by scoped css (like any css-in-js solution) since any CSS could just target `div { }`. This allows ionic components so be safely used in ANY existing site
2 replies 1 retweet 8 likesShow this thread -
Frameworks like Angular / React and Vue, need total control over the light-dom, that's why you can't safely mix frameworks. Shadow-dom hides the component's dom from the framework's render, so you can make sure react will not destroy your component, it acts as a black box!
2 replies 1 retweet 11 likesShow this thread -
Performance, shadow-dom has built-in content projection (<slot>) and in combination with Constructable Stylesheets, we can make style invalidation much faster since the stylesheets are locally scoped, instead of having tons of global CSS that apply to the whole DOM
1 reply 1 retweet 8 likesShow this thread -
Shadow-dom still has some problems (different thread), and that's why some components at Ionic does not use it. Fortunately,
@stenciljs supports scoped and "no encapsulation" for the styles! Choose the right tool, don't be a fan boy!1 reply 1 retweet 24 likesShow this thread -
Replying to @manucorporat @stenciljs
How do user agents without JS see the shadow DOM content?
2 replies 0 retweets 1 like -
Replying to @tomdale @stenciljs
Shadow-dom and customElements needs JS. However
@stenciljs is able to prerender/hydrate web components using shadow-dom. It looks like scoped css, with scope classes.1 reply 0 retweets 1 like -
There is also the other case where ShadowDOM actually helps the JS-less client, because all the crap they didn't want that would go in the shadow isn't there. E.g. <accordion><h1>Hello</h1>... may use shadow DOM but works just fine without JS ever running.
1 reply 0 retweets 2 likes
You mean, like the whole content of this page? https://bugs.chromium.org/p/chromium/issues/detail?id=4 … I'd be curious to know what a blind man thinks about it.
Loading seems to be taking a while.
Twitter may be over capacity or experiencing a momentary hiccup. Try again or visit Twitter Status for more information.