> why a shadow root instead of the markup directly, well, that's kinda like asking why use web components at all
that's way off. Web component is about encapsulation/reuse of code & markup.
I am willing to entertain the idea that at some point, some people with authority did think the shadow dom was a key part of web components. However, as of now, if you just scan comments in this entire thread, everyone think it's an annoying abstraction that unfortunately people have to deal with in order to enjoy other benefits of web components.
You better do, literally every authoritative description of web components lists shadow DOM, custom elements, and template. And the last one is kind of a remnant of the push for HTML imports, which went nowhere, and is currently insufficient for anything you'd use React for, so its main value now is how it's being repurposed for declarative shadow DOM.
So, personally, I'd say they're about shadow DOMs and custom elements, whether that's useful or not; I'm not convinced either!
that's way off. Web component is about encapsulation/reuse of code & markup.
I am willing to entertain the idea that at some point, some people with authority did think the shadow dom was a key part of web components. However, as of now, if you just scan comments in this entire thread, everyone think it's an annoying abstraction that unfortunately people have to deal with in order to enjoy other benefits of web components.