浏览器架构
进程和线程
进程（process）是程序的一次执行过程，是一个动态概念，是程序在执行过程中分配和管理资源的基本单位，线程（thread）是 CPU 调度和分派的基本单位，它可与同属一个进程的其他的线程共享进程所拥有的全部资源。
单进程架构
2007 年以前，市面上的浏览器基本都是单进程的，浏览器所有的功能模块都是运行在同一个进程，
这导致一些问题：
- 不稳定：进程中的任意一线程执行出错，都会导致整个进程的崩溃。
- 不流畅：所有模块在一个进程中，如果一个耗时的模块运行在页面线程中，会独占整个线程，导致其他任务都没有机会执行。
- 不安全：插件脚本可以获取到操作系统的任意资源。
多进程架构
以 Chrome 进程架构为例：
- 浏览器进程。主要负责界面显示、用户交互、子进程管理，同时提供存储等功能。
- 渲染进程。核心任务是将 HTML、CSS 和 JavaScript 转换为用户可以与之交互的网页，排版引擎 Blink 和 JavaScript 引擎 V8 都是运行在该进程中，默认情况下，Chrome 会为每个 Tab 标签创建一个渲染进程。出于安全考虑，渲染进程都是运行在沙箱模式下。
- GPU 进程。其实，Chrome 刚开始发布的时候是没有 GPU 进程的。而 GPU 的使用初衷是为了实现 3D CSS 的效果，只是随后网页、Chrome 的 UI 界面都选择采用 GPU 来绘制，这使得 GPU 成为浏览器普遍的需求。最后，Chrome 在其多进程架构上也引入了 GPU 进程。
- 网络进程。主要负责页面的网络资源加载，之前是作为一个模块运行在浏览器进程里面的，直至最近才独立出来，成为一个单独的进程。
- 插件进程。主要是负责插件的运行，因插件易崩溃，所以需要通过插件进程来隔离，以保证插件进程崩溃不会对浏览器和页面造成影响。
渲染阶段
文档被提交，渲染进程对页面进行解析和资源加载。按照渲染的时间顺序，分为这几个阶段：构建 DOM 树、样式计算、布局阶段、分层、绘制、分块、光栅化和合成。
- 构建 DOM 树：浏览器解析 HTML 文档，构建 DOM 树。
- 样式计算：浏览器解析 CSS 文档，构建 CSSOM 树。
- 布局阶段：根据 DOM 树和 CSSOM 树生成布局树，计算布局树节点的坐标位置。
- 分层：特定的节点生成专用的图层，并生成一棵对应的图层树（LayerTree）。
- 绘制：将图层树中的内容绘制到屏幕上。
- 分块：合成线程会将图层划分为图块，发送给光栅线程进行栅格化。
- 光栅化：光栅线程将图块转换为位图。栅格化过程都会使用 GPU 来加速（快速栅格化），生成的位图被保存在 GPU 内存中。
- 合成：合成线程将多个位图构建成合成帧，GPU 将其渲染到页面。
