将html解析为dom树;
将css解析为cssom;
结合DOM树和CSSOM树，生成一棵渲染树(Render Tree);
生成布局（flow），即将所有渲染树的所有节点进行平面合成；
将布局绘制（paint）在屏幕上
某些元素的几何信息（位置和大小）发生改变时，浏览器需要重新计算元素的几何属性，将其安放在界面中的正确位置，这个过程叫做重排。
重排又分为：
全局范围：从根节点html开始对整个渲染树进行重新布局。
局部范围：对渲染树的某部分或某一个渲染对象进行重新布局
尽量避免全局范围的重排。
某些元素的外观，例如颜色，但是几何信息不变，则会发生重绘。 重排必定会发生重绘，而重绘不一定会重排。
优化方法： 读写样式分离。不然一读一写重复进行会导致不断重排div.style.left = '10px'; 缓存布局信息。 离线改变dom。 先设置为display:none；再改变样式 position设置为absolute和fixed 避免全局范围的重排 优化动画。使用css3的动画，或者canvas动画，底层会启用GPPU加速，擅长渲染图形
3.js为什么是单线程的？为什么要又异步？js有哪些实现异步的方法？宏任务和微任务怎么理解？
如果现在有2个线程,process1 process2,由于是多线程的JS,所以他们对同一个dom,同时进行操作process1 删除了该dom,而process2 编辑了该dom,同时下达2个矛盾的命令。
如果JS中不存在异步,只能自上而下执行,如果上一行解析时间很长,那么下面的代码就会被阻塞。
对于用户而言,阻塞就意味着"卡死",这样就导致了很差的用户体验
定时器/回调函数/事件监听/promise/async await
js的异步任务队列分为宏任务和微任务两种：
宏任务： script的整体代码，setTimeout, setInterval
微任务： process.nextTick, Promise, async实质上是函数包装了return Promise()
一个宏任务的执行完毕后先执行此过程收集的微任务，执行完了之后才执行第二个宏任务
参考一个面试题理解https://mp.weixin.qq.com/s/2fnJADWMneTg6Zxl_oVahA