什么叫渲染？
render==把html字符串转换为像素信息即为渲染
function render(html){
return pixels;
}
渲染发生在什么时候？
网络：获取字符串（html...） 网络进程---网络线程----获取
渲染：转为像素点
消息队列----渲染主线程----渲染任务
过程：HTML----解析---样式计算----布局----绘制----分块----光栅化--画-------像素信息
1.解析html（parse html）------两个树-----【DOM树，CSSOM树】
2.计算样式 computed style（css不会阻塞html，js会阻塞html，遇到解析js，先暂停解析html，解析js，因此阻塞了html解析）
3.布局（根据最终计算出来的样式进行布局---行盒 块盒）-----得到一个布局树
4.分层（提升效率）will-change：transform;
5.绘制（收到指令绘制，绘制什么样的点等等。类似canvas）
（渲染主线程到此结束）
6.分块（Tiling）将每一层分成不同的小区域（优先绘画视口显示的小区域-----由合成线程完成）
7.光栅化（将每个块变成位图）（优先视口的块光栅化，由GPU进程（多个线程）完成(比cpu功能更多)）
8.画（quad指引信息交给GPU进程-----由合成线程完成，根据位图形成像素点）
渲染进程（沙河安全，在浏览器中使用GPU，无法使用硬件）----渲染主线程----合成线程
transform不在主线程上 所以效率会很高
什么是reflow（重新排版）？
修改了dom，cssom几何信息的时候，需要重新计算样式的过程称为refolw。获取到几何信息后，立即执行reflow，解决性能问题。
什么是repaint？
根据分层信息得到重绘指令。如果分层变化，就会重新发送重绘的指令，进行重绘。
为什么transform效率高？
因为transform只影响最后一步draw，所以效率高，不会产生重新计算，重新绘画等过程。（滚动条也是）