【浏览器渲染原理】渲染树构建之构建渲染树的流程

在Firefox中，系统会针对DOM更新注册展示层，作为侦听器。展示层将框架创建工作委托给FrameConstructor，由该构造器解析样式并创建frame。

在Webkit中，解析样式和创建renderer的过程就是attach。每个DOM节点都会调用attach方法。Attach是同步进行的，将节点插入DOM树需要调用新的节点attach方法。

处理html和body标记就会构建渲染树根节点。这个根节点渲染对象对应于CSS规范中所说的容器block，这是最上层的block，包含了其他所有block。它的尺寸就是视口，即浏览器窗口显示区域的尺寸。在Firefox中，叫ViewPortFrame；在Webkit中，叫RenderView。渲染树的其余部分以DOM树节点插入的形式来构建。

【参考资料】

 浏览器的工作原理