Q:

How does the node object tree get in the browser

I understand that javascript is synchronous.
But how does the Node object tree get constructed is it done in the browser where the browser produces an object referred to as 
    Node and all its properties 
for both the CSS engine to paint, and the javascript engine to transverse the html dom. Or The page when downloaded, is loaded into javascript engine and javascript parses it to get the Node tree ready in the global execution context? E.g 
Function(fetched_page) -> Node tree constructor 

A:

Generally the browser will use native code to parse the HTML page contents as it is loading.
Any scripts contained in the page is executed as its found (unless loaded with a <script> tag with defer and/or async attributes).  This is why you can't refer to an element defined in the <body> of a page from within a script found in the <head> unless you wait for an "onload" event or similar - those elements don't exist yet.
The DOM-related functions that are available within the browser's JavaScript interpreter are normally just hooks to the same native code functions used within the browser itself.

