Christian Wattengård I'm not mixing them up, I'm saying they're the same type of silliness and stem from the same mentality.
... and really if we wanted to style those things what was wrong with just hiding the element and using an aliased DOM element that's semantically neutral (like DIV and SPAN)? You know, like how scriptless modals and scriptless hamburger menus work? (or at least should work?)
It just feels like extra code, confusing/pointless methodology, and convoluted thinking all to address a non-issue.
Hence my comparison. I'm not saying they're the same thing, I'm saying they stem from the same lack of thought. You know, the literary concept of a simile?
and before someone in the peanut gallery chimes in, I did not just misspell smilie.
Jason Knight
The less code you use, the less there is to break
Never even heard of the latter, though Christian Wattengård's answer explains why... but as to the so-called "shadow DOM" that always just struck me as another of these bits of BS terminology someone slapped in there to take something -- that you should NEVER even be thinking about or worrying about -- and make it sound more important than it is.
Likely stemming from that same 'fear of ACTUALLY using the DOM' that led to such ignorant halfwitted nonsense as that "Virtual DOM" asshattery. That seems to exist JUST so incompetent fools can keep sleazing along using innerHTML instead of manning up and learning to use the various document.createxxx methods!
See this article developers.google.com/web/fundamentals/web-compon…
...and how it makes up all sorts of lame excuses and ignorant broken dumbass approaches to hooking onto things JUST to continue justify using innerHTML despite some two decades of our knowing it's anywhere from 30 to 200 times slower than using the DOM properly.
That's some serious herpa-freaking-derp right there. Likely stemming from what they call being a drawback being THE ENTIRE HUFFING POINT of using createElement!!!
How to make things more complicated, bloated, and slower -- whilst selling people on it being somehow magically easier with propaganda and coasting on reputation; and because it's Google the jobbers and bobbers just nod in mindless agreement like sheep on their way to the slaughterhouse.
YMMV, but the moment I see innerHTML= in a codebase, I automatically assume it was written by an ignorant incompetent moron... with the possible exception of innerHTML = ''; Since an empty assignment can be faster than a node flush if there's a LOT of nodes.
In case you don't know what a node flush is:
while (element.firstChild) do element.removeChild(element.firstChild);Which CAN be faster if there are around 50 or less elements. More than 50 elements to remove innerHTML = ''; does the same thing and is faster.
But I would NEVER, EVER write code like this:
shadowRoot.innerHTML = ` <style>#tabs { ... }</style> <!-- styles are scoped to fancy-tabs! --> <div id="tabs">...</div> <div id="panels">...</div> `;OH HELL NO!!! and it's not just the innerHTML, don't even get me started about the bloody STYLE tag...
So much of this stuff reeks of these people working in JS not knowing enough about HTML or CSS to be telling others how to do a damned thing with web technologies!