The Document Object Model (DOM) is a programming interface for HTML, XML and SVG documents. It provides a structured representation of the document (a tree) and it defines a way that the structure can be accessed from programs so that they can change the document structure, style and content. The DOM provides a representation of the document as a structured group of nodes and objects that have properties and methods. Nodes can also have event handlers attached to them, and once that event is triggered the event handlers get executed. Essential y, it connects web pages to scripts or programming languages.
The DOM is what the browser actually renders with the provided assets.
1)A tree of nodes that the browser renders with your assets.
1)A tree of nodes that the browser renders with your assets. An API for you to interact w/ via JS.
What is the Shadow DOM?
Angular 1.x Solution
Shadow DOM Solution
Why should you care?
So what about Virtual DOM?
Virtual DOM + render(); ≈ Dirty Checking + $scope. $digest();
● Transclusion has limitations ● Shadow DOM solves those problems and adds encapsulation ● Virtual DOM has nothing to do w/ Shadow DOM & is for rapid data rendering