客户端容器 | 青训营笔记
浏览器架构模式
- 单进程架构：所有模块运行在同一个进程里，包含网络、插件、JavaScript运行环境等
- 多进程架构：主进程、网络进程、渲染进程、GPU进程、插件进程
- 面向服务架构：多进程架构的升级版。将原来的UI、数据库、文件、设备、网络等，作为一个独立的基础网络服务
渲染树（render树）
DOM节点可以分为 可视化节点 和 非可视化节点，像 div、p 等这种结构性的标签节点可被称为可视化节点，而 script、meta 等这种在页面上显示不出来的节点则被称为非可视化节点；
那渲染树(render树)是什么呢？
浏览器获取 HTML 文件，然后对文件进行解析，形成 DOM Tree，与此同时，进行 CSS 解析，生成 Style Rules，接着将 DOM Tree 与 Style Rules 合成为 Render Tree，元素在页面中布局，然后绘制。
render 树就是根据 可视化节点 和 css 样式表 结合诞生出来的树。
display: none 的元素会出现在 DOM 树中，但不会出现在 render 树中。
CSS 对象模型 (CSSOM)
在浏览器构建我们这个简单页面的 DOM 时，在文档的 head 部分遇到了一个 link 标记，该标记引用一个外部 CSS 样式表：style.css。由于预见到需要利用该资源来渲染页面，它会立即发出对该资源的请求。
与处理 HTML 时一样，我们需要将收到的 CSS 规则转换成某种浏览器能够理解和处理的东西。因此，我们会重复 HTML 过程，不过是为 CSS 而不是 HTML。
CSSOM 为何具有树结构？为页面上的任何对象计算最后一组样式时，浏览器都会先从适用于该节点的最通用规则开始（例如，如果该节点是 body 元素的子项，则应用所有 body 样式），然后通过应用更具体的规则（即规则“向下级联”）以递归方式优化计算的样式。
注意，以上树并非完整的 CSSOM 树，它只显示了我们决定在样式表中替换的样式。每个浏览器都提供一组默认样式（也称为“User Agent 样式”），即不提供任何自定义样式时所看到的样式，我们的样式只是替换这些默认样式（例如默认 IE 样式）。
CSSOM 和 DOM 是独立的数据结构。
