• Tags , ,         
  • 2018-03-13  14:27:29        
  • 45 °C    

    时间轴事件模型显示并录制触发的所有事件。使用时间轴事件参考可了解有关每个时间轴事件类型的详细信息。

    通用的时间轴事件属性

    某些细节存在于所有类型的事件中,而一些仅适用于某些事件类型。这个部分列出了不同事件类型的通用属性。某些事件类型的特定属性在以下事件类型的引用中列出。

    属性 显示详情
    Aggregated time
    聚合时间
    对于具有嵌套事件的事件,每个事件类别所花费的时间。
    Call Stack
    访问栈
    对于具有子事件的事件,每个事件类别所花费的时间。
    CPU time
    CPU 时间
    录制的事件占用了多少CPU时间。
    Details
    详细信息
    关该事件的其他详细信息。
    Duration (at time-stamp)
    持续时间(时间戳)
    事件和子事件完成所花费的时间;时间戳是事件发生的开始时间,相对于录制开始的时间。
    Self time
    自身时间
    事件本身完成所花费的时间,不包括子事件。
    Used Heap Size
    使用的堆大小
    当录制事件时,应用程序所耗内存,和上次采样以来使用堆大小的增量(+/-)变化。

    Loading(加载)事件

    这部分列出属于 Loading(加载) 类别的事件和他们的属性。

    事件 描述
    Parse HTML
    解析HTML
    Chrome执行其HTML解析算法。
    Finish Loading
    结束加载
    一个网络请求完成
    Receive Data
    接收数据
    收到请求的数据。 将有一个或多个接收数据事件。
    Receive Response
    接收响应
    来自一个请求的初始HTTP响应。
    Send Request
    发送请求
    网络请求已发送。

    Loading(加载)事件属性

    属性 描述
    Resource
    资源
    所请求资源的URL。
    Preview
    预览
    预览所有请求的资源 (仅限`image`)。
    Request Method
    请求方法
    用于请求的HTTP方法(例如:`GET`或`POST`)。
    Status Code
    状态码
    HTTP响应状态码。
    MIME Type
    MIME类型
    所请求资源的MIME类型。
    Encoded Data Length
    编码数据长度
    以字节为单位的请求资源的长度。

    Scripting(脚本)事件

    这部分列出属于 Scripting(脚本) 类别的事件和他们的属性。

    事件 描述
    Animation Frame Fired
    动画帧发射
    一个预定的动画帧被触发,并调用它的回调处理程序。
    Cancel Animation Frame
    取消动画帧
    A scheduled animation frame was canceled.
    GC Event
    GC事件
    垃圾回收时触发
    DOMContentLoaded 浏览器触发 DOMContentLoaded 。当所有网页的DOM内容都已加载并解析时,会触发此事件。
    Evaluate Script
    计算脚本
    评估一个脚本。
    Event
    事件
    avaScript事件(例如:"mousedown", 或者 "key")。
    Function Call
    函数调用
    进行了顶级JavaScript函数调用(仅在浏览器进入JavaScript引擎时显示)。
    Install Timer
    安装计时器
    使用 setInterval()setTimeout() 创建的一个计时器。
    Request Animation Frame
    请求动画帧
    requestAnimationFrame() 调用一个预定的新帧。
    Remove Timer
    移除计时器
    先前创建的定时器被移除。
    Time
    计时
    调用 console.time()
    Time End
    结束计时
    调用 console.timeEnd()
    Timer Fired
    计时器触发
    调用先前定义的 setInterval() 或者 setTimeout() 触发定时器
    XHR Ready State Change
    XHR就绪状态更改
    XMLHTTPRequest的就绪状态发生变化。
    XHR Load An XMLHTTPRequest XMLHTTPRequest完成加载。

    Scripting(脚本)事件属性

    属性 描述
    Timer ID
    计时器ID
    计时器ID。
    Timeout
    超时
    计时器指定的超时时间。
    Repeats
    重复
    布尔值,如果计时器重复。
    Function Call
    函数调用
    一个函数被调用

    Rendering(渲染)事件

    这部分列出属于 Rendering(渲染) 类别的事件和他们的属性。

    事件 描述
    Invalidate layout
    布局无效
    通过DOM修改使页面布局无效。
    Layout
    布局
    执行了页面布局。
    Recalculate style
    重新计算样式
    Chrome重新计算元素样式。
    Scroll
    滚动
    内嵌的视图内容已滚动。

    Rendering(渲染)事件属性

    属性 描述
    Layout invalidated
    布局无效
    对于布局录制,代码的堆栈跟踪导致布局无效。
    Nodes that need layout
    需要布局的节点
    对于布局录制, 在重新开始启动之前标记为需要布局的节点数。 这些节点通常是由开发人员无效的节点代码, 加上一个向上到relayout根的路径。
    Layout tree size
    布局树大小
    对于布局录制,继承根下的节点总数 (Chrome启动重新布局的节点)。
    Layout scope
    布局范围
    可能的值为`Partial` (重新布局边界是DOM的一部分)或`Whole document"`(整个文档)。
    Elements affected
    受影响的元素
    对于重新计算样式录制,受 样式 重新计算影响的元素数量。
    Styles invalidated
    样式无效
    对于重新计算样式录制, 提供导致style无效的代码栈跟踪。

    Painting(绘制)事件

    这部分列出属于 Painting(绘制) 类别的事件和他们的属性。

    事件 描述
    Composite Layers
    复合层
    Chrome的渲染引擎合成图像图层。
    Image Decode
    图像解码
    图像资源被解码。
    Image Resize
    图像调整大小
    图片的原始尺寸已调整大小。
    Paint
    绘制
    复合层被绘制到显示器的一个区域。 悬停在绘制录制上,突出显示已更新的显示区域。

    Painting(绘制)事件属性

    属性 描述
    Location
    位置
    对于`Paint`(绘制)事件, 绘制矩形的x和y坐标。
    Dimensions
    尺寸
    对于`Paint`(绘制)事件, 绘制矩形的高度和宽度。

    说明

    翻译自:https://developers.google.com/web/tools/chrome-devtools/evaluate-performance/performance-reference

     

    本文内容来自:Chrome DevTools谷歌浏览器时间轴事件参考 – Break易站


    —Author: Arvin Chen —Web Address: www.breakyizhan.com (Break易站)

     
    转载请保留页面地址:https://www.breakyizhan.com/chromeconsole/2153.html