浏览器渲染页面的流程
1、根据html文件构建DOM树和CSSOM树。构建DOM树期间，如果遇到JS，阻塞DOM树及CSSOM树的构建，优先加载JS文件，加载完毕，再继续构建DOM树及CSSOM树。
2、构建渲染树（Render Tree）。
3、页面的重绘（repaint）与重排（reflow，也有称回流）。页面渲染完成后，若JS操作了DOM节点，根据JS对DOM操作动作的大小，浏览器对页面进行重绘或是重排。
引起重排的场景：（当页面布局和几何属性改变时就需要重排）
（1）、添加或者删除可见的DOM元素；
（2）、元素位置改变——display、float、position、overflow等等；
（3）、元素尺寸改变——边距、填充、边框、宽度和高度
（4）、内容改变——比如文本改变或者图片大小改变而引起的计算值宽度和高度改变；
（5）、页面渲染初始化；
（6）、浏览器窗口尺寸改变——resize事件发生时
注意：重排必将引起重绘，而重绘不一定会引起重排。