渲染流程就是浏览器展示页面的流程,在这个流程里,浏览器通过获取到服务端返回的HTML、CSS和JS等静态资源进行处理并展示出页面,这里经过的流程按时间线分的话有:构建DOM树、样式计算、布局阶段、分层、绘制、分块、光栅化和合成,是为一个渲染流水线。其中面试的时候经常会问到的回流(重排reflow)和重绘(repaint)也是出在这个渲染流程里,下面来逐个步骤的说明讲解。
一、构建DOM树(DOMTree)
我们知道,浏览器是无法直接理解和使用HTML的,为了能让浏览器理解我们写的HTML,所以需