时间轴事件参考文档

Meggin Kearney

Flavio Copes

“时间轴事件”模式会显示录制期间触发的所有事件。如需详细了解每种时间轴事件类型，请参阅时间轴事件参考文档。

常见的时间轴事件属性

某些详细信息适用于所有类型的事件，而某些详细信息仅适用于特定类型的事件。本部分列出了不同事件类型共有的属性。以下各个事件类型的参考文档中列出了特定事件类型专有的属性。

属性	何时显示
总时间	对于包含嵌套事件的事件，每个类别事件所用的时间。
调用堆栈	对于包含子事件的事件，则是各类事件所用的时间。
CPU 时间	录制的事件所用 CPU 时间。
详细信息	有关事件的其他详细信息。
时长（在时间戳时刻）	事件及其所有子事件完成所用的时间；时间戳是事件发生的时间（相对于录制开始时间）。
自身耗时	不考虑任何子事件的情况下，事件所用的时间。
已用堆大小	记录事件时应用使用的内存量，以及自上次采样以来所用堆大小的增量（+/-）。

正在加载事件

本部分列出了属于“加载”类别的事件及其属性。

事件	说明
解析 HTML	Chrome 执行了 HTML 解析算法。
完成加载	网络请求已完成。
接收数据	收到了请求的数据。系统会发出一个或多个 Receive Data 事件。
接收响应	来自请求的初始 HTTP 响应。
发送请求	网络请求已发送。

加载事件属性

属性	说明
资源	请求的资源的网址。
预览	请求的资源的预览（仅限图片）。
请求方法	用于请求的 HTTP 方法（例如 GET 或 POST）。
状态代码	HTTP 响应代码。
MIME 类型	请求的资源的 MIME 类型。
编码数据长度	请求的资源的长度（以字节为单位）。

脚本事件

本部分列出了属于“脚本”类别的事件及其属性。

事件	说明
已触发动画帧	已触发调度动画帧，并调用了其回调处理程序。
取消动画帧	已取消安排的动画帧。
GC 事件	发生了垃圾回收。
DOMContentLoaded	浏览器触发了 DOMContentLoaded。当网页的所有 DOM 内容均已加载并解析完毕时，系统会触发此事件。
评估脚本	脚本已评估。
事件	JavaScript 事件（例如“mousedown”或“key”）。
函数调用	进行了顶级 JavaScript 函数调用（仅在浏览器进入 JavaScript 引擎时显示）。
安装计时器	使用 setInterval() 或 setTimeout() 创建了计时器。
请求动画帧	requestAnimationFrame() 调用安排了新帧
移除计时器	清除了之前创建的计时器。
时间	一个名为 console.time() 的脚本
结束时间	一个名为 console.timeEnd() 的脚本
计时器已触发	使用 setInterval() 或 setTimeout() 调度的已触发计时器。
XHR 就绪状态变更	XMLHTTPRequest 的准备就绪状态已更改。
XHR 加载	XMLHTTPRequest 已加载完毕。

脚本事件属性

属性	说明
计时器 ID	计时器 ID。
超时	计时器指定的超时时间。
重复	布尔值，用于指定计时器是否重复。
函数调用	被调用的函数。

渲染事件

本部分列出了属于“渲染”类别的事件及其属性。

事件	说明
使布局失效	DOM 更改使页面布局无效。
布局	执行了页面布局。
重新计算样式	Chrome 重新计算了元素样式。
滚动	嵌套视图的内容已滚动。

渲染事件属性

属性	说明
布局失效	对于布局记录，导致布局失效的代码的堆栈轨迹。
需要设置布局的节点	对于布局记录，表示在重新布局开始之前被标记为需要布局的节点数。这些通常是开发者代码使其失效的节点，以及向上到重新布局根的路径。
布局树大小	对于布局记录，重新布局根（Chrome 开始重新布局的节点）下的节点总数。
布局范围	可能的值为“部分”（重新布局边界是 DOM 的一部分）或“整个文档”。
受影响的元素	对于“重新计算样式”记录，表示受样式重新计算影响的元素数量。
样式失效	对于“重新计算样式”记录，提供导致样式失效的代码的堆栈轨迹。

绘制事件

本部分列出了属于绘制类别的事件及其属性。

事件	说明
复合图层	Chrome 的渲染引擎会合成图片层。
图片解码	解码了图片资源。
调整图片大小	图片已从其原始尺寸调整大小。
颜料	合成图层会绘制到显示屏的某个区域。将鼠标悬停在 Paint 记录上会突出显示更新后的显示区域。

绘制事件属性

属性	说明
位置	对于 Paint 事件，是绘制矩形的 x 和 y 坐标。
维度	对于 Paint 事件，绘制区域的高度和宽度。