页面渲染流程
解析html
解析html文档生成DOM树(script会阻塞解析)
加载子资源
样式计算
主线程解析css并确定每个DOM节点的计算样式，基于选择器确定将哪些样式作用于每个元素上，即使没有设置样式，浏览器也会赋予节点默认样式。
布局
遍历DOM树和计算样式来创建布局树。布局树包含每个页面上的元素节点具体的几何属性和样式。(即包含伪元素，不包含display:none的元素)。
绘制
绘制阶段会确定每个DOM节点的绘制顺序，主线程会遍历布局树来创建绘制记录
合成
主线程遍历布局树来创建层树，将页面分隔成不同的图层，然后合成器分别对这些图层进行栅格化，最后生成帧显示在视口中，如果用户滚动页面，则移动图层生成新的帧来实现动画。