blob: 37f8077dd02c3873ffe77e8c30d06efc68d6a81a (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
|
---
title: PerformanceResourceTiming
slug: Web/API/PerformanceResourceTiming
translation_of: Web/API/PerformanceResourceTiming
---
<div>{{APIRef("Resource Timing API")}}</div>
<div>PerformanceResourceTiming接口可以检索和分析有关加载应用程序资源的详细网络计时数据。 应用程序可以使用timing指标来确定获取特定资源所需的时间长度，例如<span class="seoSummary">{{domxref("XMLHttpRequest")}}</span>，<span class="seoSummary">{{SVGElement("SVG","SVG element")}}</span>，image或script。</div>
<div></div>
<div>这个接口使用{{domxref("DOMHighResTimeStamp","high-resolution timestamps")}} 属性创建加载资源时间轴，用于网络事件，例如重定向开始( redirect start )和结束时间，获取开始( fetch start )，DNS查找开始( DNS lookup start )和结束时间，响应开始( response start )和结束时间等。此外，接口扩展{{domxref("PerformanceEntry")}}与其他属性，这些属性提供有关获取资源大小的数据以及初始化时获取的资源类型。</div>
<div></div>
<p>{{InheritanceDiagram}}</p>
<p>{{AvailableInWorkers}}</p>
<h2 id="属性">属性</h2>
<p>此接口通过限定和约束{{domxref("PerformanceEntry")}}属性来扩展资源性能条目类型，如下所示：</p>
<dl>
<dt> {{domxref("PerformanceEntry.entryType")}}{{readonlyInline}}</dt>
<dd>返回 <code>"resource"</code>.</dd>
<dt>{{domxref("PerformanceEntry.name")}}{{readonlyInline}}</dt>
<dd>返回 resources URL.</dd>
<dt>{{domxref("PerformanceEntry.startTime")}}{{readonlyInline}}</dt>
<dd>在资源提取开始的时间返回{{domxref("DOMHighResTimeStamp","timestamp")}}。该值等于{{domxref("PerformanceEntry.fetchStart")}}。</dd>
<dt>{{domxref("PerformanceEntry.duration")}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp","timestamp")}}，它是{{domxref("PerformanceResourceTiming.responseEnd","responseEnd")}}和{{domxref("PerformanceEntry.startTime","startTime")}}属性之间的差异。</dd>
</dl>
<p>该接口还支持以下属性，这些属性按记录顺序列出以获取单个资源。 按字母顺序排列的列表显示在左侧的导航栏中。</p>
<dl>
<dt>{{domxref('PerformanceResourceTiming.initiatorType')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMString","string")}}，表示初始化性能条目的资源类型，如{{domxref('PerformanceResourceTiming.initiatorType')}}中所规定。</dd>
<dt>{{domxref('PerformanceResourceTiming.nextHopProtocol')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMString","string")}} ，表示用于获取资源的网络协议，由<a href="https://tools.ietf.org/html/rfc7301">ALPN Protocol ID (RFC7301)</a>标识。</dd>
<dt>{{domxref('PerformanceResourceTiming.workerStart')}}{{readonlyInline}}</dt>
<dd>如果Service Worker线程已在运行，则在调用{{domxref("FetchEvent")}}之前立即返回{{domxref("DOMHighResTimeStamp")}}，如果尚未运行，则在启动Service Worker线程之前立即返回{{domxref("DOMHighResTimeStamp")}}。 如果资源未被Service Worker拦截，则该属性将始终返回0。</dd>
<dt>{{domxref('PerformanceResourceTiming.redirectStart')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}}， 表示初始重定向的开始获取时间。</dd>
<dt>{{domxref('PerformanceResourceTiming.redirectEnd')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}} ，紧接在收到最后一次重定向响应的最后一个字节后。</dd>
<dt>{{domxref('PerformanceResourceTiming.fetchStart')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}} ，紧接在浏览器开始获取资源之前。</dd>
<dt>{{domxref('PerformanceResourceTiming.domainLookupStart')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}}，紧接在浏览器启动资源的域名查找之前。</dd>
<dt>{{domxref('PerformanceResourceTiming.domainLookupEnd')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}} ，表示浏览器完成资源的域名查找后的时间。</dd>
<dt>{{domxref('PerformanceResourceTiming.connectStart')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}} ，紧接在浏览器检索资源，开始建立与服务器的连接之前。</dd>
<dt>{{domxref('PerformanceResourceTiming.connectEnd')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}} ，紧接在浏览器完成与服务器的连接以检索资源之后。</dd>
<dt>{{domxref('PerformanceResourceTiming.secureConnectionStart')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}} ，紧接在浏览器启动握手过程之前，以保护当前连接。</dd>
<dt>{{domxref('PerformanceResourceTiming.requestStart')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}} ，紧接在浏览器开始从服务器请求资源之前。</dd>
<dt>{{domxref('PerformanceResourceTiming.responseStart')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}} ，紧接在浏览器收到服务器响应的第一个字节后。</dd>
<dt>{{domxref('PerformanceResourceTiming.responseEnd')}}{{readonlyInline}}</dt>
<dd>返回{{domxref("DOMHighResTimeStamp")}} ，紧接在浏览器收到资源的最后一个字节之后或紧接在传输连接关闭之前，以先到者为准。</dd>
<dt>{{domxref('PerformanceResourceTiming.transferSize')}}{{readonlyInline}}</dt>
<dd>表示获取资源的大小（以八位字节为单位）的<code>数字</code>。 包括响应头字段和响应payload body的大小。</dd>
<dt>{{domxref('PerformanceResourceTiming.encodedBodySize')}}{{readonlyInline}}</dt>
<dd>在删除任何应用的内容编码之前，从payload body的提取（HTTP或高速缓存）接收的大小（以八位字节为单位）的<code>数字</code>。</dd>
<dt>{{domxref('PerformanceResourceTiming.decodedBodySize')}}{{readonlyInline}}</dt>
<dd>在删除任何应用的内容编码之后，从消息正文( message body )的提取（HTTP或缓存）接收的大小（以八位字节为单位）的<code>数字</code>。</dd>
<dt>{{domxref('PerformanceResourceTiming.serverTiming')}}{{readonlyInline}}</dt>
<dd>包含服务器时序度量( timing metrics )的{{domxref("PerformanceServerTiming")}} 条目数组。</dd>
</dl>
<h2 id="方法">方法</h2>
<dl>
<dt>{{domxref("PerformanceResourceTiming.toJSON()")}}</dt>
<dd>返回{{domxref("DOMString")}}， 它是 {{domxref("PerformanceResourceTiming")}} 对象的JSON表示形式。</dd>
</dl>
<h2 id="Example">Example</h2>
<p>See the example in <a href="/Web/API/Resource_Timing_API/Using_the_Resource_Timing_API">Using the Resource Timing API</a>.</p>
<h2 id="规范">规范</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('Resource Timing', '#performanceresourcetiming', 'PerformanceResourceTiming')}}</td>
<td>{{Spec2('Resource Timing')}}</td>
<td>Initial definition.</td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
<p>{{Compat("api.PerformanceResourceTiming")}}</p>
<h2 id="参考">参考</h2>
<ul>
<li><a href="/Web/API/Resource_Timing">Resource Timing (Overview)</a></li>
<li><a href="/Web/API/Resource_Timing_API/Using_the_Resource_Timing_API">Using the Resource Timing API</a></li>
</ul>
|
