As a backend developer this could equally be real front end stuff or satire to take the piss out of it. To me the entire DOM stuff is as understandable as magical lore anyway.
The browser has an internal model for representing the HTML document, called the Document Object Model (DOM). This DOM happens to be tree-shaped, because HTML is tree-shaped. And certain logic in a browser gets applied to subtrees, like e.g. most CSS rules.
Sometimes, however, you want a subtree to not get affected by what’s going on in the main tree, for example when including an SVG into that tree, or if you’re offering JavaScript library with a pre-built component.
And yeah, that is what the Shadow DOM does. It also shields the rest of the DOM from what you’re doing inside the Shadow DOM. And there’s certain mechanisms to selectively allow interaction across the shadow boundary, e.g. when providing a pre-built component, you might still want the user to be able to style parts of it.
The Shadow Dom just means pseudo elements. Obviously they have to exist somewhere so they exist in the shadow Dom but it’s pretty easy to access you basically just do it just like you would any other Dom node.
I haven’t touched any front end code since I was a junior about 15 years ago. My CS degree didn’t involve any more gui than simple stuff, so I was very overwhelmed by it. I ended up focusing on database work and business processes instead.
The way the DOM and shadow DOM is described now seems logical, so I guess I shouldn’t have too much issue wrapping my brain around the concepts should I end up needing it in the furure. But I am very fond of where I am working purely with business logic and leaving the graphics to other people.
As a backend developer this could equally be real front end stuff or satire to take the piss out of it. To me the entire DOM stuff is as understandable as magical lore anyway.
Shadow DOM trees are very real, and I feel like a Wizard trying to decrypt ancient runes every time I have to deal with them, so you’re not far off.
ELI a Backend Developer?
The browser has an internal model for representing the HTML document, called the Document Object Model (DOM). This DOM happens to be tree-shaped, because HTML is tree-shaped. And certain logic in a browser gets applied to subtrees, like e.g. most CSS rules.
Sometimes, however, you want a subtree to not get affected by what’s going on in the main tree, for example when including an SVG into that tree, or if you’re offering JavaScript library with a pre-built component.
And yeah, that is what the Shadow DOM does. It also shields the rest of the DOM from what you’re doing inside the Shadow DOM. And there’s certain mechanisms to selectively allow interaction across the shadow boundary, e.g. when providing a pre-built component, you might still want the user to be able to style parts of it.
It is very much real: https://developer.mozilla.org/en-US/docs/Glossary/Shadow_tree
Thank you for not shitting on frontend. Have a wonderful day
The Shadow Dom just means pseudo elements. Obviously they have to exist somewhere so they exist in the shadow Dom but it’s pretty easy to access you basically just do it just like you would any other Dom node.
I haven’t touched any front end code since I was a junior about 15 years ago. My CS degree didn’t involve any more gui than simple stuff, so I was very overwhelmed by it. I ended up focusing on database work and business processes instead.
The way the DOM and shadow DOM is described now seems logical, so I guess I shouldn’t have too much issue wrapping my brain around the concepts should I end up needing it in the furure. But I am very fond of where I am working purely with business logic and leaving the graphics to other people.
Everyone knows you just keep guessing until you get it right.
Don’t worry about how janky or slow it makes the UI. That’s basically a requirement for the modern browser.