其实就是浏览器解析html的过程
浏览器是如何渲染页面的？
当浏览器的网络进程拿到html文档后，会产生一个渲染任务，并将其传递给渲染主线程的消息队列，在事件循环机制的作用下，渲染主线程取出消息队列中的渲染任务，并开启渲染流程,拿到html字符串
解析html
产生DOM树和CSSOM（css object Model）树，字符串转换成对象结构。
css的解析不会阻碍渲染主线程，因为css的下载在网络线程、解析在预解析线程，根本原因是因为不在一个线程，互不影响。
js会阻塞：因为在解析js的时候，可能会修改之前的dom树。
样式计算（最终样式）
css属性值的计算过程：层叠、继承 遍历dom树，算出每个节点的最终样式。预设值变成绝对值，相对单位变成绝对单位比如 em会转换成px
布局
遍历dom树，计算每个节点的几何信息，比如宽高、相对包含快的位置。 指的是包含块的位置，内容必须在行盒中
width:100%,这个百分号值得相对于包含快的100%，并不是相对于父元素
dom树和布局树不一定是一一对应 不会生成到布局树： 设置display:none、 伪元素选择器：虽然不存在dom里面，但拥几何信息，会保存到布局树中
分层
绘制
对每一层生成绘制指令
分块
光栅化
将每个块转换成位图，此过程在GPU（浏览器进程）中，加快速度。
画
reflow (重排、回流)
repaint（重绘）
不会影响几何信息
