web front page rendering (DOM)

CSS will block construction of the render tree, do not block DOM building, but before CSSOM built, will not begin to render a page (blank), after CSSOM built, the page will show content.

 

Render tree construction

  

 

 

  1, from the root node of the DOM tree traversing each node visible.

  2, some nodes are not visible (such as script tags, meta tags, etc.), because they will not be reflected in the rendered output, it will be ignored.
     Some nodes by CSS to hide, and therefore will be ignored in the render tree, for example, in the above example span node --- do not appear in the rendering tree --- because there is an explicit rule set on that node a "display: none" attribute.

  3, for each visible node, found its adaptation CSSOM rules and apply them.

  4, the transmitting node can be seen, along with its contents and calculated patterns.

 

Guess you like

Origin www.cnblogs.com/syw20170419/p/11937690.html