浏览器的构成

浏览器在不断的演变中，并没有被要求呈现出一种特定的形态，但基本包括了如用户地址栏输入框、网络请求、浏览器文档解析、渲染引擎渲染网页、 JavaScript 引擎执行 js 脚本、客户端存储等功能。从原理构成上分为七个模块，分别是User Interface（用户界面）、Browser engine（浏览器引擎）、Rendering engine（渲染引擎）、Networking（网络）、JavaScript Interpreter（js解释器）、UI Backend（UI后端）、Date Persistence（数据持久化存储）。结构如下所示：

和大多数浏览器不同，Chrome 浏览器的每个标签页都分别对应一个渲染引擎实例。每个标签页都是一个独立的进程。

其中，最重要的是渲染引擎（内核）和JavaScript解释器（JavaScript引擎）。浏览器内核主要负责 HTML、CSS 的解析，页面布局、渲染与复合层合成，主流的内核有：Blink、Webkit、Gecko、EdgeHTML、Trident。JavaScript引擎负责 JavaScript 代码的解释与执行，主流的 JavaScript 引擎有：V8、SpiderMonkey、JavaScriptCore、Chakra。

当加载一个网页时，粗略的说会经过以下这些步骤：

DOM 树的构建（Parse HTML）

构建 CSSOM 树（Recaculate Style）

合并 DOM 树与 CSSOM 树为 Render 树

布局（Layout）

绘制（Paint）

复合图层化（Composite）

Recaculate Style 是因为浏览器本身有User Agent StyleSheet，最终的样式是我们的样式代码与用户代理默认样式覆盖/重新计算得到的。

当遇到 JavaScript 脚本或者外部 JavaScript 代码时，浏览器便停止 DOM 的构建（阻塞 1）。停下 DOM 构建的同时，继续执行 JavaScript 代码或者下载外部脚本执行，要视情况而定。

当遇到