时间轴事件参考文档

Meggin Kearney
Meggin Kearney
Flavio Copes
Flavio Copes

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

常见的时间轴事件属性

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

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

正在加载事件

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

事件说明
解析 HTMLChrome 执行了 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 事件,绘制区域的高度和宽度。