浏览器渲染原理误区

1.DOM树的构建从什么时候开始的？

DOM树的构建是从接受到文档开始的 一边会进行将字节转化为字符 字符转化为标记 标记构建dom树，这个过程被分为标记化和树构建。
“这是一个渐进的过程。为达到更好的用户体验，呈现引擎会力求尽快将内容显示在屏幕上。它不必等到整个 HTML 文档解析完毕之后，就会开始构建呈现树和设置布局。在不断接收和处理来自网络的其余内容的同时，呈现引擎会将部分内容解析并显示出来。”

2.渲染树是在DOM树和CSS样式树构建完毕才开始构建的吗？

结合下面这个渲染流程图：

疑惑来源于这句话：为了更好的用户体验，浏览器不会等解析完整个HTML才开始渲染，而是一边解析一边渲染。

原来以为这句话的意思是CSSOM和DOM都是一边构建，一边形成Render树，再进行布局和绘制的。但其实不然！
“CSSOM形成前，浏览器不会渲染任何已处理内容，所以CSS被视为阻塞渲染的资源。”
所以这张图的正确理解应该是：在CSSOM已经构建完成的前提下，DOM树可以一边构建一边与已经构建完成的CSSOM结合成Render树。

3.css的标签嵌套越多，越容易定位到元素

这个问题其实来源于自己的惯性思维，写css的时候觉得嵌套越多定位就越精确，但我们是从左向右写，而浏览器是从右向左进行解析的，先找到最右边的标签，然后一层层向上找，所以嵌到多了反而加大工作量。