Where exactly the Virtual DOM is stored?

Question

I'm torturing myself for hours now and can't find an answer. Where exactly, under what object/key, the React data are located? I found an object ReactRoot that seems to store all the information about components, but I have no idea where it sits in the window (I guess?) object.

It has to be somewhere under the window object, right?

If you take a memory snapshot and select the ReactRoot constructor from the list, chrome will create a reference to it under $0 ( $0 in chrome ).

EDIT

Is it possible that ReactRoot is declared in a way that makes it inaccessible for other objects? How is this possible in js? React isn't getting any special treatment from the browsers, is he?

Answer 1

There is a document explaining the DOM Level 1 fundamental methods. See also the DOM Level 1 Core specification from the W3C .

When you create an element, a new instance of the element were created but not rendered. Not until you include them into the DOM tree.

Browser will only render elements within the document body. But everything else is just an instance of an object, the virtual DOM.

// create a new Text node for the second paragraph
    var newText = document.createTextNode("This is the second paragraph.");
    // create a new Element to be the second paragraph
    var newElement = document.createElement("P");