浏览器渲染进程(rendering process)是以管道形式（rendering pipeline）渲染的，管道形式渲染的当前步骤都依赖于上一步骤的结果，
因此更新渲染成本很高。
浏览器渲染进程包含了 主进程(main thread)， 合成线程（compositor thread），光栅线程（raster thread）, worker 线程(worker theads)
主进程(main thread)：
解析HTML生成DOM树，解析CSS 为DOM树添加计算样式。
拥有DOM Tree + Computed Style 还不够构成布局，需要知道每个DOM在页面x,y轴坐标，边框大小，是否display:none，是否 visibility: hidden，是否有::before伪元素。因此我们需要为DOM创建格式化上下文FC（Formatting Context）也叫Nomal Flow 或 Flow Layout。 Formatting Context分为：块级格式化上下文（BFC）跟 内联格式上下文（IFC)， 遍历完DOM 树生成Layout Tree。此外CSS流式布局还涉及到边距折叠（Margin Collapsing），折叠原则是选绝对值最大
拥有Layout Tree 还不够构成布局，因为不知道哪个FC需要先画（z-index, position: absolute), 因此主线程遍历生成Paint Records。
拥有了Paint Records还不够，现代浏览器会通过主线程会遍历Layout tree将这些信息分层为Layer Tree
合成线程（compositor thread）
主线程将Paint Records 跟 Layer Tree 提交给合成线程，合成线程将每个Layer将其分成很多一小块(divides them into tiles)， 根据可视范围优先选择对应的光栅线程。
合并光栅线程光栅化后的位图为绘画块（Draw quads，记录了tiles的内存信息等）并创建了合成帧（compositor frame）。 通过IPC将合成帧传递给浏览器进程光栅线程（ Raster threads）
光栅线程将合成线程的分块光栅化为位图，并将位图发送存储GPU内存