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
|
---
title: パフォーマンスタイムライン
slug: Web/API/Performance_Timeline
tags:
- Web パフォーマンス
- ガイド
- 概要
translation_of: Web/API/Performance_Timeline
---
<div>{{DefaultAPISidebar("Performance Timeline API")}}</div>
<p><strong>パフォーマンスタイムライン</strong> API は、{{domxref("Performance")}} インターフェイスへの拡張を定義して、アプリケーション内のクライアントサイドの待ち時間の測定をサポートします。 拡張機能は、特定のフィルタ基準に基づいて{{domxref("PerformanceEntry","performance entry metrics", '', 'true')}} を取得するためのインターフェイスを提供します。この規格には、特定のパフォーマンスイベントがブラウザのパフォーマンスタイムラインに追加されたときに通知される <em>{{anch("Performance_Observers","performance observer", '', 'true')}}</em> コールバックをアプリケーションで定義できるインターフェイスも含まれます。</p>
<p>このドキュメントは規格のインターフェイスの概要を提供します。インターフェイスの詳細については、リファレンスページおよび<a href="/ja/Web/API/Performance_Timeline/Using_Performance_Timeline">パフォーマンスタイムラインの使用</a>を参照してください。</p>
<h2 id="Performance_拡張">Performance 拡張</h2>
<p>パフォーマンスタイムライン API は、{{domxref("Performance")}} インターフェイスを、指定されたフィルター基準に応じて一連の {{domxref("PerformanceEntry","パフォーマンスレコード (メトリック)")}} を取得するためのさまざまなメカニズムを提供する3つのメソッドで拡張します。メソッドは以下のとおりです。</p>
<dl>
<dt>{{domxref("Performance.getEntries","getEntries()")}}</dt>
<dd>Returns all recorded {{domxref("PerformanceEntry","performance entries")}} or, optionally, the entries based on the specified {{domxref("PerformanceEntry.name","name")}}, {{domxref("PerformanceEntry.entryType","performance type")}} and/or the {{domxref("PerformanceEntry.initiatorType","initiatorType")}} (such as an HTML element).</dd>
<dt>{{domxref("Performance.getEntriesByName","getEntriesByName()")}}</dt>
<dd>Returns the recorded {{domxref("PerformanceEntry","performance entries")}} based on the specified {{domxref("PerformanceEntry.name","name")}} and optionally the {{domxref("PerformanceEntry.entryType","performance type")}}.</dd>
<dt>{{domxref("Performance.getEntriesByType","getEntriesByType()")}}</dt>
<dd>Returns the recorded {{domxref("PerformanceEntry","performance entries")}} based on the specified {{domxref("PerformanceEntry.entryType","performance type")}}.</dd>
</dl>
<h2 id="PerformanceEntry_インターフェイス">PerformanceEntry インターフェイス</h2>
<p>The {{domxref("PerformanceEntry")}} interface encapsulates a single <em>performance entry</em> — that is, a single data point or metric in the <em>performance timeline</em>. This interface has the following four properties, and these properties are extended (with additional constraints) by other interfaces (such as {{domxref("PerformanceMark")}}):</p>
<dl>
<dt>{{domxref("PerformanceEntry.name","name")}}</dt>
<dd>The name of the performance entry when the metric was created.</dd>
<dt>{{domxref("PerformanceEntry.entryType","entryType")}}</dt>
<dd>The type of performance metric (for example, "<code>mark</code>").</dd>
<dt>{{domxref("PerformanceEntry.startTime","startTime")}}</dt>
<dd>A {{domxref("DOMHighResTimeStamp","high resolution timestamp")}} representing the starting time for the performance entry.</dd>
<dt>{{domxref("PerformanceEntry.duration","duration")}}</dt>
<dd>A {{domxref("DOMHighResTimeStamp","high resolution timestamp", '', 'true')}} representing the time value of the duration of the performance event. (Some performance {{domxref("PerformanceEntry.entryType","entry types", '', 'true')}} have no concept of <em>duration</em> and this value is set to <code>'0'</code> for such types.)</dd>
</dl>
<p>This interface includes a {{domxref("PerformanceEntry.toJSON","toJSON()")}} method that returns the serialization of the {{domxref("PerformanceEntry")}} object. The serialization is specific to the performance entry's {{domxref("PerformanceEntry.entryType","type")}}.</p>
<h2 id="Performance_オブザーバー">Performance オブザーバー</h2>
<p>{{SeeCompatTable}}</p>
<p>The <em>performance observer</em> interfaces allow an application to register an <em>observer</em> for specific performance event types, and when one of those event types is recorded, the application is <em>notified</em> of the event via the observer's callback function that was specified when the observer was created.</p>
<p>When the observer (callback) is invoked, the callback's parameters include a <em>{{domxref("PerformanceObserverEntryList","performance observer entry list")}}</em> that contains only <em>observed</em> {{domxref("PerformanceEntry","performance entries")}}. That is, the list contains entries only for the event types that were specified when the observer's {{domxref("PerformanceObserver.observe","observe()")}} method was invoked. The {{domxref("PerformanceObserverEntryList","performance observer entry list")}} interface has the same three <code>getEntries*()</code> methods as the {{domxref("Performance")}} interface. However, note there is one key difference with these methods; the {{domxref("PerformanceObserverEntryList","performance observer entry list")}} versions are used to retrieve <em>observed</em> performance entries within the observer callback.</p>
<p>Besides the {{domxref("PerformanceObserver","PerformanceObserver's")}} interface's {{domxref("PerformanceObserver.observe","observe()")}} method (which is used to register the {{domxref("PerformanceEntry.entryType","entry types")}} to <em>observe</em>), the {{domxref("PerformanceObserver")}} interface also has a {{domxref("PerformanceObserver.disconnect","disconnect()")}} method that stops an observer from receiving further events.</p>
<p class="note">Performance observers were added to the <code>Level 2</code> version of the standard and were not widely implemented.</p>
<h2 id="実装状況">実装状況</h2>
<p>A summary of the interfaces' implementation status is provided below, including a link to more detailed information.</p>
<ul>
<li>Performance interface extensions: As shown in the {{domxref("Performance")}} interface's <a href="/Web/API/Performance#Browser_compatibility">Browser Compatibility</a> table, most of these interfaces are broadly implemented by desktop browsers and have less support on mobile devices.</li>
<li>PerformanceEntry: As shown in the {{domxref("PerformanceEntry")}} interface's <a href="/Web/API/PerformanceEntry#Browser_compatibility">Browser Compatibility</a> table, most of these interfaces are broadly implemented by desktop browsers and have less support on mobile devices.</li>
<li>Performance Observers {{experimental_inline}}: As shown in the {{domxref("PerformanceObserver")}} interface's <a href="/Web/API/PerformanceObserver#Browser_compatibility">Browser Compatibility</a> table, this interface has no shipping implementations.</li>
</ul>
<p>To test your browser's support for these interfaces, run the <code><a href="http://mdn.github.io/web-performance/perf-api-support.html">perf-api-support</a></code> application.</p>
<h2 id="あわせて参照">あわせて参照</h2>
<ul>
<li><a href="http://siusin.github.io/perf-timing-primer/">A Primer for Web Performance Timing APIs</a></li>
</ul>
|
