页面生命周期

页面构建
当 Web 应用能被展示或交互之前,其页面必须根据服务器获取的响应(通常是 HTML、CSS 和 JavaScript 代码)来构建。页面构建阶段的目标是建立 Web 应用的 UI,其主要包括两个步骤:
- 解析 HTML 代码并构建文档对象模型 (DOM);
- 执行 JavaScript 代码。
步骤 1 会在浏览器处理 HTML 节点的过程中执行,步骤二会在 HTML 解析到一种特殊节点——脚本节点(包含或引用 JavaScript 代码的节点)时执行。页面构建阶段中,这两个步骤会交替执行多次
HTML 解析和 DOM 构建
通过解析收到的 HTML 代码,构建一个个 HTML 元素,构建 DOM。在这种对 HTML 结构化表示的形式中,每个 HTML 元素都被当作一个节点。
在页面构建阶段,浏览器会遇到特殊类型的 HTML 元素——脚本元素,该元素用于包括 JavaScript 代码。每当解析到脚本元素时,浏览器就会停止从 HTML 构建 DOM,并开始执行 JavaScript 代码。
执行 JavaScript 代码
当浏览器在页面构建阶段遇到了脚本节点,它会停止 HTML 到 DOM 的构建,转而开始执行 JavaScript 代码,也就是执行包含在脚本元素的全局 JavaScript 代码 (以及由全局代码执行中调用的函数代码)。
大致区分出两种不同类型的 JavaScript 代码:全局代码和函数代码。