Resource Timing API - 检索和分析有关应用程序资源加载的详细网络时序数据

Resource Timing 接口可以检索和分析有关应用程序资源加载的详细网络时序数据。例如,应用程序可以使用计时指标来确定加载特定资源(如 XMLHttpRequest<SVG>、图像或脚本)所需的时间长度。

接口的属性创建一个资源加载时间线,其中包含用于网络事件的高精度时间戳,例如重定向开始和结束时间、DNS 查找开始和结束时间、请求开始、响应开始和结束时间等。该接口还包括其他属性,这些属性提供有关获取的资源大小的数据以及启动获取的资源的类型

本文档概述了 Resource Timing 接口。有关包括实例在内的接口的更多详细信息,请参阅每个接口的参考页面、使用资源计时 API 以及相关链接部分中的参考。有关资源时序处理模型的图形表示,请参见资源时序阶段图。

注意: 此特性在 Web Worker 中可用。

PerformanceResourceTiming 接口为 PerformanceEntry 扩展了 entryTyperesource性能条目

高精度时间戳

一些 Resource Timing 属性返回高精度时间戳。这些时间戳的类型为 DOMHighResTimeStamp,顾名思义,它们代表一个高精度的时间点。这种类型是一个 double,它的值是一个离散时间点或两个离散时间点之间的时间差。

DOMHighResTimeStamp 的单位是毫秒,应该精确到 5 µs(微秒)。但是,如果浏览器无法提供精确到 5 µs 的时间值(例如,由于硬件或软件限制),浏览器可以将该值表示为精确到毫秒的毫秒时间。

资源加载时间戳

应用程序可以获得用于加载资源的各个阶段的时间戳。处理模型中的第一个属性是 startTime ,它在资源加载过程开始之前立即返回时间戳。fetchStart 的时间戳是跟随和重定向处理(如果有的话),并在DNS查询之前。下一个阶段是 connectStartconnectEnd,它们分别是连接到服务器之前和之后的时间戳。最后三个时间戳依次为: requestStart - 浏览器开始向服务器请求资源之前的时间戳;responseStart - 浏览器收到服务器响应的第一个字节后的时间戳;和 responseEnd - 浏览器收到资源最后一个字节后的时间戳。如果资源是通过安全连接加载的,则在连接开始和结束事件之间将有一个 secureConnectionStart 时间戳。

注意:CORS 生效时,其中许多值将返回为零,除非服务器的访问策略允许共享这些值。这要求提供资源的服务器发送 Timing-Allow-Origin HTTP 响应标头,其值指定允许获取受限时间戳值的一个或多个来源。

从网页本身以外的域加载资源时默认返回为 0 的属性有: redirectStartredirectEnddomainLookupStartdomainLookupEndconnectStartconnectEndsecureConnectionStartrequestStartresponseStart

PerformanceResourceTiming 接口还包括几个网络计时属性。 redirectStartredirectEnd 属性分别返回重定向开始和结束时间的时间戳。 同样,domainLookupStartdomainLookupEnd 属性分别返回 DNS 查找开始和结束时间的时间戳。

资源大小

PerformanceResourceTiming 接口具有三个属性,可用于获取有关资源的大小数据。

transferSize 属性返回获取的资源的大小(以八位字节为单位),包括响应标头字段和响应负载正文。

encodedBodySize 属性返回在删除任何应用的内容编码之前,从有效负载主体的提取(HTTP 或缓存)接收到的大小(以八位字节为单位)。

decodedBodySize 返回在删除任何应用的内容编码之后,从消主体的提取(HTTP 或缓存)接收到的大小(以八位字节为单位)。

其他属性

nextHopProtocol 属性返回用于获取资源的网络协议

initiatorType 属性返回启动性能条目的资源类型,例如 CSS 资源是 “css”、XMLHttpRequest 是 “xmlhttprequest”,图像是 “img”(例如 JPEG)。

如果当前上下文是 worker,则 workerStart 属性可用于获取工作线程开始的 DOMHighResTimeStamp

方法

Resource Timing API 包括两个扩展 Performance 接口的方法。clearResourceTimings() 方法从浏览器的资源性能条目缓冲区中删除所有 “resource” 类型的性能条目。setResourceTimingBufferSize() 方法将资源性能条目缓冲区大小设置为指定数量的资源性能条目

PerformanceResourceTiming 接口的 toJSON() 方法返回 “resource” 类型的性能条目

规范

规范
Resource Timing

实现状态

PerformanceResourceTiming 接口的浏览器兼容性表所示,桌面浏览器实现了这些接口中的大多数。但是,请注意,某些属性几乎没有实现,因此请参阅每个属性的 “浏览器兼容性” 部分以获取更具体的数据。

要测试浏览器对这些接口的支持,请运行 perf-api-support 应用程序。

相关链接