时间轴事件参考文档

Meggin Kearney

Flavio Copes

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

常见的时间轴事件属性

某些详细信息适用于所有类型的事件，而有些详细信息仅适用于特定事件类型。本部分列出了不同事件类型的通用属性。特定于特定事件类型的属性列在这些事件类型遵循的参考文档中。

媒体资源	何时显示
汇总时间	对于包含嵌套事件的事件，每类事件所用的时间。
调用堆栈	对于包含子事件的事件，指每类事件所用的时间。
CPU 时间	所记录事件占用的 CPU 时间。
具体说明	与事件相关的其他详细信息。
时长（带有时间戳）	完成事件及其所有子项所用的时间；时间戳是事件发生时间（相对于录制开始时间）。
自身所用时间	事件在没有任何子项的情况下所花费的时间。
已使用的堆大小	记录事件时应用使用的内存量，以及自上次采样以来所用堆大小的增量 (+/-) 变化。

正在加载事件

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

事件	说明
解析 HTML	Chrome 执行了其 HTML 解析算法。
完成加载	网络请求已完成。
接收数据	已收到请求的数据。存在一个或多个“接收数据”事件。
接收响应	请求的初始 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 启动重新布局的节点）下的节点总数。
布局范围	可能的值为“Partial”（重新布局边界是 DOM 的一部分）或“整个文档”。
受影响的元素	对于重新计算样式记录，表示受样式重新计算影响的元素数量。
样式已失效	对于重新计算样式记录，提供导致样式失效的代码的堆栈轨迹。

绘画活动

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

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

绘制事件属性

媒体资源	说明
位置	对于绘制事件，绘制矩形的 x 坐标和 y 坐标。
维度	对于绘制事件，绘制区域的高度和宽度。