1.什么是渲染树？和DOM树及CSSOM树有什么关系？html
首先咱们得先了解一下渲染的基本步骤
当用户请求的资源经过浏览器网络层到达渲染引擎后。渲染工做就会开始。
第一步：浏览器解析HTML文档和解析CSS样式表造成DOM树和CSSOM树
第二步 : 结合DOM树和CSSDOM树造成 render树。 也就是咱们所说的渲染树。渲染树
第三步： 浏览器在render树内对每一个render节点进行布局处理，计算出每个元素的大小和位置。肯定其在屏幕上的位置
第四步：绘制。经过遍历render树将实际的像素显示到屏幕上浏览器
以上的步骤是一个渐进的步骤，可是为了提升用户体验，浏览器并不会等待全部html文档加载完成以后才创建渲染树并渲染。 他会在从网络层获取html文档的同时把已经接收到的局部内容先渲染出来网络
2.渲染树是如何造成的？
基于DOM树的一些可视化的节点，WebKit根据须要来建立相应的RenderObject节点，这些节点也构成了一颗树，称为render树。app
Render树是基于Dom树创建起来的新的一棵树，Render节点和Dom节点并非一一对应。因此什么状况下须要创建新的render节点呢？
- DOM树document节点
- DOM树种的可视化节点
- 某些状况下创建匿名的render节点
有一个问题就是什么算可视化节点呢？
好比 Html,Body,Div,P等就是可视化结点， 而非可视化节点就是 Head, Meta, Script等。
好比一个DIV的display属性是none，那么它就是非可视节点。
可是注意. 若是DIV的visibility属性是hidden，它是可视节点。
这是一个细节须要注意。
什么状况下创建匿名的render节点？
RenderBlock用来是用来表示块级元素， 为了处理上的方便，某些状况下须要创建匿名的RenderBlock对象，由于RenderBlock的子女必须都是内嵌的元素或者都是非内嵌的元素。因此，当它包含两种元素的时候，那么它会为相邻的内嵌元素建立一个块级RenderBlock节点，而后设置该节点为本身的子女而且设置这些内嵌元素为它的子女。函数
浏览器的渲染顺序问题（摘抄）布局
1.浏览器加载和渲染html的顺序spa
一、IE下载的顺序是从上到下，渲染的顺序也是从上到下，下载和渲染是同时进行的。.net
二、在渲染到页面的某一部分时，其上面的全部部分都已经下载完成（并非说全部相关联的元素都已经下载完）htm
三、若是遇到语义解释性的标签嵌入文件（JS脚本，CSS样式），那么此时IE的下载过程会启用单独链接进行下载。对象
四、而且在下载后进行解析，解析过程当中，中止页面全部往下元素的下载。阻塞加载
五、样式表在下载完成后，将和之前下载的全部样式表一块儿进行解析，解析完成后，将对此前全部元素（含之前已经渲染的）从新进行渲染。
六、JS、CSS中若有重定义，后定义函数将覆盖前定义函数
2. JS的加载
2.1 不能并行下载和解析（阻塞下载）
2.2 当引用了JS的时候，浏览器发送1个js request就会一直等待该request的返回。由于浏览器须要1个稳定的DOM树结构，而JS中颇有可能有代码直接改变了DOM树结构，好比使用 document.write 或 appendChild,甚至是直接使用的location.href进行跳转，浏览器为了防止出现JS修改DOM树，须要从新构建DOM树的状况，因此 就会阻塞其余的下载和呈现.