diff options
| author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
|---|---|---|
| committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
| commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
| tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/ja/web/api/performance | |
| parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
| download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip | |
initial commit
Diffstat (limited to 'files/ja/web/api/performance')
17 files changed, 1539 insertions, 0 deletions
diff --git a/files/ja/web/api/performance/clearmarks/index.html b/files/ja/web/api/performance/clearmarks/index.html new file mode 100644 index 0000000000..2ffd6a8df5 --- /dev/null +++ b/files/ja/web/api/performance/clearmarks/index.html @@ -0,0 +1,94 @@ +--- +title: performance.clearMarks() +slug: Web/API/Performance/clearMarks +tags: + - API + - Web パフォーマンス + - メソッド +translation_of: Web/API/Performance/clearMarks +--- +<div>{{APIRef("User Timing API")}}</div> + +<p><strong><code>clearMarks()</code></strong> メソッドは、ブラウザのパフォーマンスエントリバッファから名前付きマークを削除します。<br> + このメソッドが引数なしで呼び出された場合、{{domxref("PerformanceEntry.entryType","エントリタイプ")}} が "<code>mark</code>" の{{domxref("PerformanceEntry","パフォーマンスエントリ")}}はすべてパフォーマンスエントリバッファから削除されます。</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>performance</em>.clearMarks(); +<em>performance</em>.clearMarks(name); +</pre> + +<h3 id="引数">引数</h3> + +<dl> + <dt>name {{optional_inline}}</dt> + <dd>タイムスタンプの名前を表す{{domxref("DOMString")}}。 この引数を省略すると、 {{domxref("PerformanceEntry.entryType","entry type")}} が "<code>mark</code>" であるすべての {{domxref("PerformanceEntry","performance entries")}} が削除されます。</dd> +</dl> + +<h3 id="戻り値">戻り値</h3> + +<dl> + <dt>void</dt> +</dl> + +<h2 id="例">例</h2> + +<p>次の例は、<code>clearMarks()</code> メソッドの両方の使用法を示しています。</p> + +<pre class="brush: js">// Create a small helper to show how many PerformanceMark entries there are. +function logMarkCount() { + console.log( + "Found this many entries: " + performance.getEntriesByType("mark").length + ); +} + +// Create a bunch of marks. +performance.mark("squirrel"); +performance.mark("squirrel"); +performance.mark("monkey"); +performance.mark("monkey"); +performance.mark("dog"); +performance.mark("dog"); + +logMarkCount() // "Found this many entries: 6" + +// Delete just the "squirrel" PerformanceMark entries. +performance.clearMarks('squirrel'); +logMarkCount() // "Found this many entries: 4" + +// Delete all of the PerformanceMark entries. +performance.clearMarks(); +logMarkCount() // "Found this many entries: 0" +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('User Timing Level 2', '#dom-performance-clearmarks', 'clearMarks()')}}</td> + <td>{{Spec2('User Timing Level 2')}}</td> + <td><code>clearMarks()</code> を明確にします。</td> + </tr> + <tr> + <td>{{SpecName('User Timing', '#dom-performance-clearmarks', 'clearMarks()')}}</td> + <td>{{Spec2('User Timing')}}</td> + <td>基本的な定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.clearMarks")}}</p> +</div> diff --git a/files/ja/web/api/performance/clearmeasures/index.html b/files/ja/web/api/performance/clearmeasures/index.html new file mode 100644 index 0000000000..20be39aac6 --- /dev/null +++ b/files/ja/web/api/performance/clearmeasures/index.html @@ -0,0 +1,96 @@ +--- +title: performance.clearMeasures() +slug: Web/API/Performance/clearMeasures +tags: + - API + - Web パフォーマンス + - メソッド + - リファレンス +translation_of: Web/API/Performance/clearMeasures +--- +<div>{{APIRef("User Timing API")}}</div> + +<p><strong><code>clearMeasures()</code></strong> メソッドは、ブラウザのパフォーマンスエントリバッファから<em>名前付きメジャー</em>を削除します。<br> + メソッドが引数なしで呼び出された場合、エントリタイプが "measure" の{{domxref("PerformanceEntry","パフォーマンスエントリ")}} はすべてパフォーマンスエントリバッファから削除されます。</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>performance</em>.clearMeasures(); +<em>performance</em>.clearMeasures(name); +</pre> + +<h3 id="引数">引数</h3> + +<dl> + <dt>name {{optional_inline}}</dt> + <dd>タイムスタンプの名前を表す {{domxref("DOMString")}}。この引数を省略すると、{{domxref("PerformanceEntry.entryType","エントリタイプ")}}が "<code>measure</code>" の{{domxref("PerformanceEntry","パフォーマンスエントリ")}}がすべて削除されます。</dd> +</dl> + +<h3 id="戻り値">戻り値</h3> + +<dl> + <dt>void</dt> +</dl> + +<h2 id="例">例</h2> + +<p>次の例は、<code>clearMeasures()</code> メソッドの両方の使用方法を示しています。</p> + +<pre class="brush: js">// Create a small helper to show how many PerformanceMeasure entries there are. +function logMeasureCount() { + console.log( + "Found this many entries: " + performance.getEntriesByType("measure").length + ); +} + +// Create a bunch of measures. +performance.measure("from navigation"); +performance.mark("a"); +performance.measure("from mark a", "a"); +performance.measure("from navigation"); +performance.measure("from mark a", "a"); +performance.mark("b"); +performance.measure("between a and b", "a", "b"); + +logMeasureCount() // "Found this many entries: 5" + +// Delete just the "from navigation" PerformanceMeasure entries. +performance.clearMeasures("from navigation"); +logMeasureCount() // "Found this many entries: 3" + +// Delete all of the PerformanceMeasure entries. +performance.clearMeasures(); +logMeasureCount() // "Found this many entries: 0" +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('User Timing Level 2', '#dom-performance-clearmeasures', 'clearMeasures()')}}</td> + <td>{{Spec2('User Timing Level 2')}}</td> + <td><code>clearMeasures()</code> を明確にします。</td> + </tr> + <tr> + <td>{{SpecName('User Timing', '#dom-performance-clearmeasures', 'clearMeasures()')}}</td> + <td>{{Spec2('User Timing')}}</td> + <td>基本的な定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.clearMeasures")}}</p> +</div> diff --git a/files/ja/web/api/performance/clearresourcetimings/index.html b/files/ja/web/api/performance/clearresourcetimings/index.html new file mode 100644 index 0000000000..2fdf0e630b --- /dev/null +++ b/files/ja/web/api/performance/clearresourcetimings/index.html @@ -0,0 +1,90 @@ +--- +title: performance.clearResourceTimings() +slug: Web/API/Performance/clearResourceTimings +tags: + - API + - Web パフォーマンス + - メソッド + - リファレンス +translation_of: Web/API/Performance/clearResourceTimings +--- +<div>{{APIRef("Resource Timing API")}}</div> + +<p><strong><code>clearResourceTimings()</code></strong> メソッドは、{{domxref("PerformanceEntry.entryType","entryType")}} が "<code>resource</code>" のすべての{{domxref("PerformanceEntry","パフォーマンスエントリ")}}をブラウザのパフォーマンスデータバッファから削除し、パフォーマンスデータバッファのサイズをゼロに設定します。ブラウザのパフォーマンスデータバッファのサイズを設定するには、{{domxref("Performance.setResourceTimingBufferSize()")}} メソッドを使用します。</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>performance</em>.clearResourceTimings(); +</pre> + +<h3 id="引数">引数</h3> + +<dl> + <dt>void</dt> + <dd> </dd> +</dl> + +<h3 id="Return_Value" name="Return_Value">戻り値</h3> + +<dl> + <dt>なし</dt> + <dd>このメソッドには戻り値はありません。</dd> +</dl> + +<h2 id="例">例</h2> + +<pre class="brush: js">function load_resource() { + var image = new Image(); + image.src = "https://developer.mozilla.org/static/img/opengraph-logo.png"; +} +function clear_performance_timings() { + if (performance === undefined) { + log("Browser does not support Web Performance"); + return; + } + // Create a resource timing performance entry by loading an image + load_resource(); + + var supported = typeof performance.clearResourceTimings == "function"; + if (supported) { + console.log("Run: performance.clearResourceTimings()"); + performance.clearResourceTimings(); + } else { + console.log("performance.clearResourceTimings() NOT supported"); + return; + } + // getEntries should now return zero + var p = performance.getEntriesByType("resource"); + if (p.length == 0) + console.log("... Performance data buffer cleared"); + else + console.log("... Performance data buffer NOT cleared!"); +} +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Resource Timing', '#dom-performance-clearresourcetimings', 'clearResourceTimings()')}}</td> + <td>{{Spec2('Resource Timing')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.clearResourceTimings")}}</p> +</div> diff --git a/files/ja/web/api/performance/getentries/index.html b/files/ja/web/api/performance/getentries/index.html new file mode 100644 index 0000000000..ce8fc8f497 --- /dev/null +++ b/files/ja/web/api/performance/getentries/index.html @@ -0,0 +1,104 @@ +--- +title: performance.getEntries() +slug: Web/API/Performance/getEntries +tags: + - API + - Web パフォーマンス + - メソッド + - リファレンス +translation_of: Web/API/Performance/getEntries +--- +<div>{{APIRef("Performance Timeline API")}}</div> + +<p><strong><code>getEntries()</code></strong> メソッドは、そのページのすべての {{domxref("PerformanceEntry")}} オブジェクトのリストを返します。リストのメンバ (エントリ) は、明示的な時点でパフォーマンスマークまたはメジャーを作成することで (たとえば {{domxref("Performance.mark","mark()")}} メソッドを呼び出すことで) 作成できます。特定の種類のパフォーマンスエントリや特定の名前のパフォーマンスエントリにのみ関心がある場合は、{{domxref("Performance.getEntriesByType", "getEntriesByType()")}} と {{domxref("Performance.getEntriesByName", "getEntriesByName()")}} を参照してください。</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="構文">構文</h2> + +<p>一般的な構文:</p> + +<pre class="syntaxbox"><em>entries</em> = window.performance.getEntries(); +</pre> + +<h3 id="Return_Value" name="Return_Value">戻り値</h3> + +<dl> + <dt>entries</dt> + <dd>{{domxref("PerformanceEntry")}} オブジェクトの配列。項目はエントリ '{{domxref("PerformanceEntry.startTime","startTime")}} に基づいて時系列に並んでいます。</dd> +</dl> + +<h2 id="例">例</h2> + +<pre class="brush: js">function use_PerformanceEntry_methods() { + console.log("PerformanceEntry tests ..."); + + if (performance.mark === undefined) { + console.log("... performance.mark Not supported"); + return; + } + + // Create some performance entries via the mark() method + performance.mark("Begin"); + do_work(50000); + performance.mark("End"); + performance.mark("Begin"); + do_work(100000); + performance.mark("End"); + do_work(200000); + performance.mark("End"); + + // Use getEntries() to iterate through the each entry + let p = performance.getEntries(); + for (var i=0; i < p.length; i++) { + console.log("Entry[" + i + "]"); + check_PerformanceEntry(p[i]); + } + + // Use getEntriesByType() to get all "mark" entries + p = performance.getEntriesByType("mark"); + for (let i=0; i < p.length; i++) { + console.log ("Mark only entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } + + // Use getEntriesByName() to get all "mark" entries named "Begin" + p = performance.getEntriesByName("Begin", "mark"); + for (let i=0; i < p.length; i++) { + console.log ("Mark and Begin entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } +} +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Performance Timeline Level 2', '#dom-performance-getentries', 'getEntries()')}}</td> + <td>{{Spec2('Performance Timeline Level 2')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('Performance Timeline', '#dom-performance-getentries', 'getEntries()')}}</td> + <td>{{Spec2('Performance Timeline')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.getEntries")}}</p> +</div> diff --git a/files/ja/web/api/performance/getentriesbyname/index.html b/files/ja/web/api/performance/getentriesbyname/index.html new file mode 100644 index 0000000000..288c4c6f13 --- /dev/null +++ b/files/ja/web/api/performance/getentriesbyname/index.html @@ -0,0 +1,118 @@ +--- +title: performance.getEntriesByName() +slug: Web/API/Performance/getEntriesByName +tags: + - API + - Web パフォーマンス + - メソッド + - リファレンス +translation_of: Web/API/Performance/getEntriesByName +--- +<div>{{APIRef("Performance Timeline API")}}</div> + +<p><strong><code>getEntriesByName()</code></strong> メソッドは、指定された<em>名前</em>と<em>タイプ</em>の {{domxref("PerformanceEntry")}} オブジェクトのリストを返します。リストのメンバ (<em>エントリ</em>) は、明示的な時点でパフォーマンス<em>マーク</em>または<em>メジャー</em>を作成することで (たとえば {{domxref("Performance.mark","mark()")}} メソッドを呼び出すことで) 作成できます。</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>entries</em> = window.performance.getEntriesByName(name, type); +</pre> + +<h3 id="引数">引数</h3> + +<dl> + <dt>name</dt> + <dd>取得するエントリの名前</dd> + <dt>type {{optional_inline}}</dt> + <dd>"<code>mark</code>" など、取得するエントリの種類。有効なエントリタイプは {{domxref("PerformanceEntry.entryType")}} に一覧表示されています。</dd> +</dl> + +<h3 id="Return_Value" name="Return_Value">戻り値</h3> + +<dl> + <dt>entries</dt> + <dd>指定された <code>name</code> と <code>type</code> を持つ {{domxref("PerformanceEntry")}} オブジェクトのリスト。 <code>type</code> 引数が指定されていない場合は、返されるエントリを決定するために名前だけが使用されます。項目はエントリ '{{domxref("PerformanceEntry.startTime","startTime")}} に基づいて時系列に並んでいます。指定された基準を満たすオブジェクトがない場合は、空のリストが返されます。</dd> +</dl> + +<h2 id="例">例</h2> + +<pre class="brush: js">function use_PerformanceEntry_methods() { + log("PerformanceEntry tests ..."); + + if (performance.mark === undefined) { + log("... performance.mark Not supported"); + return; + } + + // Create some performance entries via the mark() method + performance.mark("Begin"); + do_work(50000); + performance.mark("End"); + performance.mark("Begin"); + do_work(100000); + performance.mark("End"); + do_work(200000); + performance.mark("End"); + + // Use getEntries() to iterate through the each entry + var p = performance.getEntries(); + for (var i=0; i < p.length; i++) { + log("Entry[" + i + "]"); + check_PerformanceEntry(p[i]); + } + + // Use getEntries(name, entryType) to get specific entries + p = performance.getEntries({name : "Begin", entryType: "mark"}); + for (var i=0; i < p.length; i++) { + log("Begin[" + i + "]"); + check_PerformanceEntry(p[i]); + } + + // Use getEntriesByType() to get all "mark" entries + p = performance.getEntriesByType("mark"); + for (var i=0; i < p.length; i++) { + log ("Mark only entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } + + // Use getEntriesByName() to get all "mark" entries named "Begin" + p = performance.getEntriesByName("Begin", "mark"); + for (var i=0; i < p.length; i++) { + log ("Mark and Begin entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } +} +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Performance Timeline Level 2', '#dom-performance-getentriesbyname', 'getEntriesByName()')}}</td> + <td>{{Spec2('Performance Timeline Level 2')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('Performance Timeline', '#dom-performance-getentriesbyname', 'getEntriesByName()')}}</td> + <td>{{Spec2('Performance Timeline')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.getEntriesByName")}}</p> +</div> diff --git a/files/ja/web/api/performance/getentriesbytype/index.html b/files/ja/web/api/performance/getentriesbytype/index.html new file mode 100644 index 0000000000..cb9ca5517f --- /dev/null +++ b/files/ja/web/api/performance/getentriesbytype/index.html @@ -0,0 +1,116 @@ +--- +title: performance.getEntriesByType() +slug: Web/API/Performance/getEntriesByType +tags: + - API + - Web パフォーマンス + - メソッド + - リファレンス +translation_of: Web/API/Performance/getEntriesByType +--- +<div>{{APIRef("Performance Timeline API")}}</div> + +<p><strong><code>getEntriesByType()</code></strong> メソッドは、指定された型の {{domxref("PerformanceEntry")}} オブジェクトのリストを返します。リストのメンバ (エントリ) は、明示的な時点でパフォーマンス<em>マーク</em>または<em>メジャー</em>を作成することで (たとえば {{domxref("Performance.mark","mark()")}} メソッドを呼び出すことで) 作成できます。</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>entries</em> = window.performance.getEntriesByType(type); +</pre> + +<h3 id="引数">引数</h3> + +<dl> + <dt>type</dt> + <dd>"<code>mark</code>" など、取得するエントリの種類。有効なエントリタイプは {{domxref("PerformanceEntry.entryType")}} に一覧表示されています。</dd> +</dl> + +<h3 id="Return_Value" name="Return_Value">戻り値</h3> + +<dl> + <dt>entries</dt> + <dd>指定された <code>type</code> を持つ {{domxref("PerformanceEntry")}} オブジェクトのリスト。項目はエントリ '{{domxref("PerformanceEntry.startTime","startTime")}} に基づいて時系列に並んでいます。指定された <code>type</code> を持つオブジェクトがない場合、または引数が指定されていない場合は、空のリストが返されます。</dd> +</dl> + +<h2 id="例">例</h2> + +<pre class="brush: js">function usePerformanceEntryMethods() { + log("PerformanceEntry tests ..."); + + if (performance.mark === undefined) { + log("... performance.mark Not supported"); + return; + } + + // Create some performance entries via the mark() method + performance.mark("Begin"); + doWork(50000); + performance.mark("End"); + performance.mark("Begin"); + doWork(100000); + performance.mark("End"); + doWork(200000); + performance.mark("End"); + + // Use getEntries() to iterate through the each entry + var p = performance.getEntries(); + for (var i=0; i < p.length; i++) { + log("Entry[" + i + "]"); + checkPerformanceEntry(p[i]); + } + + // Use getEntries(name, entryType) to get specific entries + p = performance.getEntries({name : "Begin", entryType: "mark"}); + for (var i=0; i < p.length; i++) { + log("Begin[" + i + "]"); + checkPerformanceEntry(p[i]); + } + + // Use getEntriesByType() to get all "mark" entries + p = performance.getEntriesByType("mark"); + for (var i=0; i < p.length; i++) { + log ("Mark only entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } + + // Use getEntriesByName() to get all "mark" entries named "Begin" + p = performance.getEntriesByName("Begin", "mark"); + for (var i=0; i < p.length; i++) { + log ("Mark and Begin entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } +} +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Performance Timeline Level 2', '#dom-performance-getentriesbytype', 'getEntriesByType()')}}</td> + <td>{{Spec2('Performance Timeline Level 2')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('Performance Timeline', '#dom-performance-getentriesbytype', 'getEntriesByType()')}}</td> + <td>{{Spec2('Performance Timeline')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.getEntriesByType")}}</p> +</div> diff --git a/files/ja/web/api/performance/index.html b/files/ja/web/api/performance/index.html new file mode 100644 index 0000000000..ac6a83dc42 --- /dev/null +++ b/files/ja/web/api/performance/index.html @@ -0,0 +1,134 @@ +--- +title: Performance +slug: Web/API/Performance +tags: + - API + - Web パフォーマンス + - インターフェイス + - ナビゲーションタイミング + - パフォーマンス + - リファレンス +translation_of: Web/API/Performance +--- +<p>{{APIRef("High Resolution Time")}}</p> + +<p><strong><code>Performance</code></strong> インターフェイスは、現在のページのパフォーマンス関連情報へのアクセスを提供します。これはHigh Resolution Time API の一部ですが、Performance Timeline API、Navigation Timing API、User Timing API、および Resource Timing API によって拡張されています。</p> + +<p>このタイプのオブジェクトは読み取り専用属性 {{domxref("window.performance")}} を呼び出すことで取得できます。</p> + +<div class="note"> +<p><strong><em>メモ</em>: </strong>このインターフェイスとそのメンバーは、以下に示されている場合を除き、<a href="/ja/docs/Web/API/Web_Workers_API">Web Workers</a> で利用可能です。 パフォーマンスマーカーと測定値はコンテキストごとにあることにも注意してください。メインスレッド (または他のワーカー) にマークを作成した場合、それを Worker スレッドには表示できません (その逆も同様)。</p> +</div> + +<h2 id="プロパティ">プロパティ</h2> + +<p><em><code>Performance</code> インターフェイスはプロパティを継承しません。</em></p> + +<dl> + <dt>{{deprecated_inline}} {{domxref("performance.navigation")}} {{readonlyInline}}</dt> + <dd>ページがロードかリフレッシュか、リダイレクトの発生回数など、<code>timing</code> にリストされている時間に含まれる操作に関する有用なコンテキストを提供するレガシー {{domxref("PerformanceNavigation")}} オブジェクト。Worker では利用できません。</dd> + <dt>{{deprecated_inline}} {{domxref("performance.timing")}} {{readonlyInline}}</dt> + <dd>待ち時間関連のパフォーマンス情報を含むレガシー {{domxref("PerformanceTiming")}} オブジェクト。Worker には利用できません。</dd> + <dt>{{domxref("performance.memory", "performance.memory")}} {{Non-standard_inline}}</dt> + <dd>Chrome で追加された<em>非標準の</em>拡張子で、このプロパティは基本的なメモリ使用量情報を持つオブジェクトを提供します。<em>この非標準の API を<strong>使うべきではありません</strong></em>。</dd> + <dt>{{domxref("performance.timeOrigin")}} {{readonlyInline}} {{Non-standard_inline}}</dt> + <dd>パフォーマンス測定の開始時刻のハイレゾリューションタイムスタンプを返します。</dd> +</dl> + +<h2 id="メソッド">メソッド</h2> + +<p><em><em><code>Performance</code> インターフェイス</em>はメソッドを継承しません。</em></p> + +<dl> + <dt>{{domxref("performance.clearMarks()")}}</dt> + <dd>ブラウザのパフォーマンスエントリバッファから指定された<em>マーク</em>を削除します。</dd> + <dt>{{domxref("performance.clearMeasures()")}}</dt> + <dd>ブラウザのパフォーマンスエントリバッファから指定された<em>数値</em>を削除します。</dd> + <dt>{{domxref("performance.clearResourceTimings()")}}</dt> + <dd>ブラウザのパフォーマンスデータバッファから "<code>resource</code>" の {{domxref("PerformanceEntry.entryType","entryType")}} を持つすべての {{domxref("PerformanceEntry","performance entries")}} を削除します。</dd> + <dt>{{domxref("performance.getEntries()")}}</dt> + <dd>与えられた<em>フィルタ</em>に基づく {{domxref("PerformanceEntry")}} オブジェクトのリストを返します。</dd> + <dt>{{domxref("performance.getEntriesByName()")}}</dt> + <dd>指定された<em>名前</em>と<em>エントリタイプ</em>に基づいて {{domxref("PerformanceEntry")}} オブジェクトのリストを返します。</dd> + <dt>{{domxref("performance.getEntriesByType()")}}</dt> + <dd>与えられた<em>エントリタイプ</em>の {{domxref("PerformanceEntry")}} オブジェクトのリストを返します。</dd> + <dt>{{domxref("performance.mark()")}}</dt> + <dd>指定された名前でブラウザの<em>パフォーマンスエントリバッファ</em>に{{domxref("DOMHighResTimeStamp","タイムスタンプ")}}を作成します。</dd> + <dt>{{domxref("performance.measure()")}}</dt> + <dd>指定された2つのマーク (それぞれ<em>開始マーク</em>と<em>終了マーク</em>と呼ばれる) の間に、ブラウザのパフォーマンスエントリバッファ内に名前付き{{domxref("DOMHighResTimeStamp","タイムスタンプ")}}を作成します。</dd> + <dt>{{domxref("performance.now()")}}</dt> + <dd>参照時点から経過したミリ秒数を表す {{domxref("DOMHighResTimeStamp")}} を返します。</dd> + <dt>{{domxref("performance.setResourceTimingBufferSize()")}}</dt> + <dd>ブラウザのリソースタイミングバッファサイズを、指定された数の "<code>resource</code>" {{domxref("PerformanceEntry.entryType","タイプ")}} {{domxref("PerformanceEntry","パフォーマンスエントリ")}} オブジェクトに設定します。</dd> + <dt>{{domxref("performance.toJSON()")}}</dt> + <dd><code>Performance</code> オブジェクトを表す json オブジェクトを返す jsonizer です。</dd> +</dl> + +<h2 id="イベント">イベント</h2> + +<p><code>addEventListener()</code> を使用するか、このインターフェイスの <code>on<em>eventname</em></code> プロパティにイベントリスナを割り当てることで、イベントを監視します。</p> + +<dl> + <dt><code><a href="/ja/docs/Web/API/Performance/resourcetimingbufferfull_event">resourcetimingbufferfull</a></code></dt> + <dd>ブラウザの<a href="/ja/docs/Web/API/Performance/setResourceTimingBufferSize">リソースタイミングバッファ</a>がいっぱいになったときに発生します。<code><a href="/ja/docs/Web/API/Performance/onresourcetimingbufferfull">onresourcetimingbufferfull</a></code> プロパティからも利用できます。</dd> +</dl> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Highres Time Level 2', '#the-performance-interface', 'toJSON()')}}</td> + <td>{{Spec2('Highres Time Level 2')}}</td> + <td><code>toJson()</code> メソッドを定義します。</td> + </tr> + <tr> + <td>{{SpecName('Highres Time', '#the-performance-interface', 'Performance')}}</td> + <td>{{Spec2('Highres Time')}}</td> + <td><code>now()</code> メソッドを定義します。.</td> + </tr> + <tr> + <td>{{SpecName('Navigation Timing', '#sec-window.performance-attribute', 'Performance')}}</td> + <td>{{Spec2('Navigation Timing')}}</td> + <td><code>timing</code> と <code>navigation</code> プロパティを定義します。</td> + </tr> + <tr> + <td>{{SpecName('Performance Timeline Level 2', '#extensions-to-the-performance-interface', 'Performance extensions')}}</td> + <td>{{Spec2('Performance Timeline Level 2')}}</td> + <td><code>getEntries()</code> インターフェイスを変更します。</td> + </tr> + <tr> + <td>{{SpecName('Performance Timeline', '#sec-window.performance-attribute', 'Performance extensions')}}</td> + <td>{{Spec2('Performance Timeline')}}</td> + <td><code>getEntries()</code>、<code>getEntriesByType()</code> および <code>getEntriesByName()</code> メソッドを定義します。</td> + </tr> + <tr> + <td>{{SpecName('Resource Timing', '#extensions-performance-interface', 'Performance extensions')}}</td> + <td>{{Spec2('Resource Timing')}}</td> + <td><code>clearResourceTimings()</code> と <code>setResourceTimingBufferSize()</code> メソッド、そして <code>onresourcetimingbufferfull</code> プロパティを定義します。</td> + </tr> + <tr> + <td>{{SpecName('User Timing Level 2', '#extensions-performance-interface', 'Performance extensions')}}</td> + <td>{{Spec2('User Timing Level 2')}}</td> + <td><code>mark()</code>、<code>clearMark()</code>、<code>measure()</code> および <code>clearMeasure()</code> インターフェイスを明確にします。</td> + </tr> + <tr> + <td>{{SpecName('User Timing', '#extensions-performance-interface', 'Performance extensions')}}</td> + <td>{{Spec2('User Timing')}}</td> + <td><code>mark()</code>, <code>clearMark()</code>, <code>measure()</code> および <code>clearMeasure()</code> インターフェイスを定義します。</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance")}}</p> +</div> diff --git a/files/ja/web/api/performance/mark/index.html b/files/ja/web/api/performance/mark/index.html new file mode 100644 index 0000000000..d22500449c --- /dev/null +++ b/files/ja/web/api/performance/mark/index.html @@ -0,0 +1,103 @@ +--- +title: performance.mark() +slug: Web/API/Performance/mark +tags: + - API + - Webパフォーマンス + - メソッド + - リファレンス +translation_of: Web/API/Performance/mark +--- +<div>{{APIRef("User Timing API")}}</div> + +<p><strong><code>mark()</code></strong> メソッドは、ブラウザの<em>パフォーマンスエントリバッファ</em>に、指定された名前で{{domxref("DOMHighResTimeStamp","timestamp")}} を作成します。アプリケーション定義のタイムスタンプは、{{domxref("Performance")}} インタフェースの <code>getEntries*()</code> メソッド ({{domxref("Performance.getEntries","getEntries()")}}、{{domxref("Performance.getEntriesByName","getEntriesByName()")}} または{{domxref("Performance.getEntriesByType","getEntriesByType()")}}) のいずれかによって取得できます。</p> + +<p>{{AvailableInWorkers}}</p> + +<p><code>mark</code> の {{domxref("PerformanceEntry","performance entry")}} は、次のプロパティ値を持ちます。</p> + +<ul> + <li>{{domxref("PerformanceEntry.entryType","entryType")}} - "<code>mark</code>" に設定されます</li> + <li>{{domxref("PerformanceEntry.name","name")}} - mark が作成されたときに与えられた "<code>name</code>" に設定されます</li> + <li>{{domxref("PerformanceEntry.startTime","startTime")}} - <code>mark()</code> が呼び出されたときに {{domxref("DOMHighResTimeStamp","timestamp")}} に設定されます</li> + <li>{{domxref("PerformanceEntry.duration","duration")}} - "<code>0</code>" に設定します (mark には<em>長さ</em>がありません)</li> +</ul> + +<p>このメソッドに与えられた <code>name</code> が {{domxref("PerformanceTiming")}} インターフェイスにすでに存在する場合、{{jsxref("SyntaxError")}} がスローされます。</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>performance</em>.mark(name); +</pre> + +<h3 id="引数">引数</h3> + +<dl> + <dt>name</dt> + <dd>マークの名前を表す {{domxref("DOMString")}}。</dd> +</dl> + +<h3 id="戻り値">戻り値</h3> + +<dl> + <dt>void</dt> + <dd> </dd> +</dl> + +<h2 id="例">例</h2> + +<p>次の例は、<code>mark()</code> を使用して {{domxref("PerformanceMark")}} エントリを作成および取得する方法を示しています。</p> + +<pre class="brush:js">// たくさんの mark を作成します。 +performance.mark("squirrel"); +performance.mark("squirrel"); +performance.mark("monkey"); +performance.mark("monkey"); +performance.mark("dog"); +performance.mark("dog"); + +// PerformanceMark エントリをすべて取得します。 +const allEntries = performance.getEntriesByType("mark"); +console.log(allEntries.length); +// 6 + +// "monkey" PerformanceMark エントリをすべて入手します。 +const monkeyEntries = performance.getEntriesByName("monkey"); +console.log(monkeyEntries.length); +// 2 + +// すべての mark を消去します。 +performance.clearMarks(); +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('User Timing Level 2', '#dom-performance-mark', 'mark()')}}</td> + <td>{{Spec2('User Timing Level 2')}}</td> + <td> + <p><code>mark()</code> 処理モデルを明確にします。</p> + </td> + </tr> + <tr> + <td>{{SpecName('User Timing', '#dom-performance-mark', 'mark()')}}</td> + <td>{{Spec2('User Timing')}}</td> + <td>基本的な定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は、<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> して、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.mark")}}</p> +</div> diff --git a/files/ja/web/api/performance/measure/index.html b/files/ja/web/api/performance/measure/index.html new file mode 100644 index 0000000000..8a536474ed --- /dev/null +++ b/files/ja/web/api/performance/measure/index.html @@ -0,0 +1,112 @@ +--- +title: performance.measure() +slug: Web/API/Performance/measure +tags: + - API + - Web Workers + - Web パフォーマンス + - メソッド + - リファレンス +translation_of: Web/API/Performance/measure +--- +<div>{{APIRef("User Timing API")}}</div> + +<p><strong><code>measure()</code></strong> メソッドは、マーク間、ナビゲーション開始時刻、または現在時刻の間に、ブラウザの<em>パフォーマンスエントリバッファ</em>に名前付き {{domxref("DOMHighResTimeStamp","timestamp")}} を作成します。2つのマーク間を測定するときは、それぞれ<em>開始マーク</em>と<em>終了マーク</em>があります。名前付きタイムスタンプは、<em>メジャー</em>と呼ばれます。</p> + +<p><code>measure</code> は、{{domxref("Performance")}} インターフェイスの1つで取得できます。({{domxref("Performance.getEntries","getEntries()")}}、{{domxref("Performance.getEntriesByName","getEntriesByName()")}}または{{domxref("Performance.getEntriesByType","getEntriesByType()")}})</p> + +<p><code>measure</code> の {{domxref("PerformanceEntry","performance entry")}} は、次のプロパティ値を持ちます。</p> + +<ul> + <li>{{domxref("PerformanceEntry.entryType","entryType")}} - "<code>measure</code>" に設定します</li> + <li>{{domxref("PerformanceEntry.name","name")}} - measure が作成されたときに指定された "<code>name</code>" に設定します</li> + <li>{{domxref("PerformanceEntry.startTime","startTime")}} - 開始マークに {{domxref("DOMHighResTimeStamp","timestamp")}} を設定します</li> + <li>{{domxref("PerformanceEntry.duration","duration")}} - 小節の長さである {{domxref("DOMHighResTimeStamp")}} に設定します (通常、終了マークのタイムスタンプから開始マークのタイムスタンプを引いたもの)</li> +</ul> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>performance</em>.measure(name); +<em>performance</em>.measure(name, startMark); +<em>performance</em>.measure(name, startMark, endMark); +<em>performance</em>.measure(name, undefined, endMark); +</pre> + +<h3 id="引数">引数</h3> + +<dl> + <dt>name</dt> + <dd>メジャーの名前を表す {{domxref("DOMString")}}。</dd> + <dt>startMark {{optional_inline}}</dt> + <dd>メジャーの開始マークの名前を表す {{domxref("DOMString")}}。{{domxref("PerformanceTiming")}} プロパティの名前になることもあります。省略した場合は、開始時間がナビゲーション開始時間になります。</dd> + <dt>endMark {{optional_inline}}</dt> + <dd>メジャーの終了マークの名前を表す {{domxref("DOMString")}}。{{domxref("PerformanceTiming")}} プロパティの名前になることもあります。省略した場合は、現在時刻が使用されます。</dd> +</dl> + +<h3 id="戻り値">戻り値</h3> + +<dl> + <dt>void</dt> + <dd> </dd> +</dl> + +<h2 id="例">例</h2> + +<p>次の例は、ブラウザのパフォーマンスエントリバッファに <code>measure()</code> を使用して新しい<em>メジャー</em>{{domxref("PerformanceEntry","パフォーマンスエントリ")}}を作成する方法を示しています。</p> + +<pre class="brush: js">const markerNameA = "example-marker-a" +const markerNameB = "example-marker-b" + +// いくつかのネストしたタイムアウトを実行し、それぞれに対して PerformanceMark を作成します。 +performance.mark(markerNameA); +setTimeout(function() { + performance.mark(markerNameB); + setTimeout(function() { + + // さまざまな測定値を作成します。 + performance.measure("measure a to b", markerNameA, markerNameB); + performance.measure("measure a to now", markerNameA); + performance.measure("measure from navigation start to b", undefined, markerNameB); + performance.measure("measure from the start of navigation to now"); + + // すべての測定値を引き出します。 + console.log(performance.getEntriesByType("measure")); + + // 最後に、エントリを整理します。 + performance.clearMarks(); + performance.clearMeasures(); + }, 1000); +}, 1000); +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('User Timing Level 2', '#dom-performance-measure', 'measure()')}}</td> + <td>{{Spec2('User Timing Level 2')}}</td> + <td><code>measure()</code> 処理モデルを明確にします。</td> + </tr> + <tr> + <td>{{SpecName('User Timing', '#dom-performance-measure', 'measure()')}}</td> + <td>{{Spec2('User Timing')}}</td> + <td>基本的な定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.measure")}}</p> +</div> diff --git a/files/ja/web/api/performance/navigation/index.html b/files/ja/web/api/performance/navigation/index.html new file mode 100644 index 0000000000..a769ac939e --- /dev/null +++ b/files/ja/web/api/performance/navigation/index.html @@ -0,0 +1,59 @@ +--- +title: Performance.navigation +slug: Web/API/Performance/navigation +tags: + - API + - Deprecated + - HTTP + - legacy + - ナビゲーションタイミング + - パフォーマンス + - プロパティ + - 後方互換性 + - 読み取り専用 +translation_of: Web/API/Performance/navigation +--- +<p>{{APIRef("Navigation Timing")}}</p> + +<div class="warning"> +<p>このプロパティは <a href="https://w3c.github.io/navigation-timing/#obsolete">Navigation Timing Level 2 仕様</a>では非推奨です。</p> +</div> + +<p>従来の <code><strong>Performance</strong></code><strong><code>.navigation</code></strong> 読み取り専用プロパティは、リソースの取得に必要なリダイレクト数など、特定のブラウジングコンテキストで発生したナビゲーションの種類を表す {{domxref("PerformanceNavigation")}} オブジェクトを返します。</p> + +<p>このプロパティは Worker では使用できません。</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>navObject</em> = <em>performance</em>.navigation;</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Navigation Timing', '#sec-window.performance-attribute', 'Performance.navigation')}}</td> + <td>{{Spec2('Navigation Timing')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.navigation")}}</p> +</div> + +<h2 id="あわせて参照">あわせて参照</h2> + +<ul> + <li>The {{domxref("Performance")}} interface it belongs to.</li> +</ul> diff --git a/files/ja/web/api/performance/now/index.html b/files/ja/web/api/performance/now/index.html new file mode 100644 index 0000000000..2c77a37538 --- /dev/null +++ b/files/ja/web/api/performance/now/index.html @@ -0,0 +1,103 @@ +--- +title: performance.now() +slug: Web/API/Performance/now +tags: + - API + - Method + - Performance + - Reference + - Web Performance API +translation_of: Web/API/Performance/now +--- +<div>{{APIRef("High Resolution Timing")}}</div> + +<p><code><strong>performance.now()</strong></code> メソッドは、ミリ秒単位で計測された {{domxref("DOMHighResTimeStamp")}} を返します。</p> + +<div class="warning"> +<p>タイムスタンプは実際には高解像度ではありません。<a href="https://spectreattack.com/">Spectre</a> のようなセキュリティ上の脅威を軽減するために、ブラウザは現在、さまざまな程度まで結果を丸めています (Firefox は Firefox 59 から 2 ミリ秒に丸めています)。ブラウザによっては、タイムスタンプを少しランダム化するものもあります。 精度は将来のリリースで改善されることでしょう。ブラウザの開発者は、これらのタイミング攻撃と、それを軽減する最善策について調査しています。</p> +</div> + +<p>{{AvailableInWorkers}}</p> + +<p>戻り値は、<a href="/ja/docs/Web/API/DOMHighResTimeStamp#The_time_origin">time origin</a> からの経過時間を表します。</p> + +<p>次の点に留意してください:</p> + +<ul> + <li>{{domxref("Window")}} コンテキストから生成された Dedicated Worker (専用ワーカー) では、この値は生成元の window における<code>performance.now()</code> の値よりも小さい値となるでしょう。従来はメインコンテキストの <code>t0</code> と同じでしたが、これは変わりました。</li> + <li>Shared Worker または Service Worker では、この値はメインコンテキストでの値よりも大きくなるかもしれません。そのウィンドウは、それらワーカー以後に生成され得るためです。</li> +</ul> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><em>t</em> = performance.now();</pre> + +<h2 id="Example" name="Example">例</h2> + +<pre class="brush: js">var t0 = performance.now(); +doSomething(); +var t1 = performance.now(); +console.log("Call to doSomething took " + (t1 - t0) + " milliseconds."); +</pre> + +<p>JavaScript で利用できる他のタイミングデータ (例えば <a href="/ja/docs/JavaScript/Reference/Global_Objects/Date/now"><code>Date.now</code></a>) とは違い、 <code>performance.now()</code> が返すタイムスタンプは、1ミリ秒の分解能に制限されません。その代わりに、マイクロ秒までの精度を持った浮動小数点の値で表します。</p> + +<p>また、<code>Date.now()</code> とは違い、<code>performance.now()</code> が返す値は、常に一定の割合で増加します。システムクロック (これはマニュアルで調整、またはNTPのようなソフトウェアで変えられているかもしれません) から独立しているのです。他方で <code>performance.timing.navigationStart + performance.now()</code> は、おおよそ <code>Date.now()</code> と同じになるでしょう。</p> + +<h2 id="Reduced_time_precision" name="Reduced_time_precision">時間精度の引き下げ</h2> + +<p>タイミング攻撃やフィンガープリンティングから保護するため、ブラウザの設定によっては、<code>performance.now()</code> の精度が丸められることがあります。<br> +Firefoxでは、<code>privacy.reduceTimerPrecision</code> の設定がデフォルトで有効になっており、Firefox 59 ではデフォルトで 20 us (マイクロ秒) に設定されています。 Firefox 60 では 2 ms (ミリ秒) になります。</p> + +<pre class="brush: js">// Firefox 60 での時間精度の引き下げ (2ms) +performance.now(); +// 8781416 +// 8781814 +// 8782206 +// ... + + +// `privacy.resistFingerprinting` 有効化による時間精度の引き下げ` +performance.now(); +// 8865400 +// 8866200 +// 8866700 +// ... +</pre> + +<p>Firefoxでは <code>privacy.resistFingerprinting</code> も有効にできます。これは、精度を 100 ms か <code>privacy.resistFingerprinting.reduceTimerPrecision.microseconds</code> のどちらか大きい方へ変更します。</p> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">策定状況</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Highres Time Level 2', '#dom-performance-now', 'performance.now()')}}</td> + <td>{{Spec2('Highres Time Level 2')}}</td> + <td>インターフェイスと型について、より厳密な定義</td> + </tr> + <tr> + <td>{{SpecName('Highres Time', '#dom-performance-now', 'performance.now()')}}</td> + <td>{{Spec2('Highres Time')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> + + + +<p>{{Compat("api.Performance.now")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>Web Fundamentals の記事: <a href="https://developers.google.com/web/updates/2012/08/When-milliseconds-are-not-enough-performance-now"> +When milliseconds are not enough: performance.now</a></li> +</ul> diff --git a/files/ja/web/api/performance/onresourcetimingbufferfull/index.html b/files/ja/web/api/performance/onresourcetimingbufferfull/index.html new file mode 100644 index 0000000000..d5845ecfa7 --- /dev/null +++ b/files/ja/web/api/performance/onresourcetimingbufferfull/index.html @@ -0,0 +1,75 @@ +--- +title: Performance.onresourcetimingbufferfull +slug: Web/API/Performance/onresourcetimingbufferfull +tags: + - API + - Web パフォーマンス + - プロパティ + - リファレンス +translation_of: Web/API/Performance/onresourcetimingbufferfull +--- +<div>{{APIRef("Resource Timing API")}}</div> + +<p><strong><code>onresourcetimingbufferfull</code></strong> プロパティは、{{event("resourcetimingbufferfull")}} イベントが発生したときに呼び出されるイベントハンドラです。このイベントは、ブラウザのリソースタイミングパフォーマンスバッファがいっぱいになったときに発生します。</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">callback = <em>performance</em>.onresourcetimingbufferfull = buffer_full_cb; +</pre> + +<h3 id="Return_Value" name="Return_Value">戻り値</h3> + +<dl> + <dt>callback</dt> + <dd>{{event("resourcetimingbufferfull")}} イベントが発生したときに呼び出される {{domxref("EventHandler")}}。</dd> +</dl> + +<h2 id="例">例</h2> + +<p>次の例では、<code>onresourcetimingbufferfull</code> プロパティにコールバック関数を設定します。</p> + +<pre class="brush: js">function buffer_full(event) { + console.log("WARNING: Resource Timing Buffer is FULL!"); + performance.setResourceTimingBufferSize(200); +} +function init() { + // Set a callback if the resource buffer becomes filled + performance.onresourcetimingbufferfull = buffer_full; +} +<body onload="init()"> +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Resource Timing', '#dom-performance-onresourcetimingbufferfull', 'onresourcetimingbufferfull')}}</td> + <td>{{Spec2('Resource Timing')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.onresourcetimingbufferfull")}}</p> +</div> + +<h2 id="あわせて参照">あわせて参照</h2> + +<ul> + <li>{{event("resourcetimingbufferfull")}} event</li> + <li>{{domxref("Performance.clearResourceTimings","Performance.clearResourceTimings()")}}</li> + <li>{{domxref("Performance.setResourceTimingBufferSize","Performance.setResourceTimingBufferSize()")}}</li> +</ul> diff --git a/files/ja/web/api/performance/resourcetimingbufferfull_event/index.html b/files/ja/web/api/performance/resourcetimingbufferfull_event/index.html new file mode 100644 index 0000000000..bfabd2adae --- /dev/null +++ b/files/ja/web/api/performance/resourcetimingbufferfull_event/index.html @@ -0,0 +1,84 @@ +--- +title: 'Performance: resourcetimingbufferfull event' +slug: Web/API/Performance/resourcetimingbufferfull_event +tags: + - API + - DOM + - Web 開発 + - onresourcetimingbufferfull + - イベント + - パフォーマンス + - リファレンス +translation_of: Web/API/Performance/resourcetimingbufferfull_event +--- +<div>{{APIRef}}</div> + +<p><code>resourcetimingbufferfull</code> イベントは、ブラウザのリソースタイミングバッファがいっぱいになると発生します。</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">バブル</th> + <td>はい</td> + </tr> + <tr> + <th scope="row">キャンセル可能</th> + <td>はい</td> + </tr> + <tr> + <th scope="row">インターフェイス</th> + <td>{{domxref("Event")}}</td> + </tr> + <tr> + <th scope="row">イベントハンドラプロパティ</th> + <td>{{domxref("Performance.onresourcetimingbufferfull", "onresourcetimingbufferfull")}}</td> + </tr> + </tbody> +</table> + +<h2 id="例">例</h2> + +<p>次の例では、<code>onresourcetimingbufferfull</code> プロパティにコールバック関数を設定します。</p> + +<pre class="brush: js">function buffer_full(event) { + console.log("WARNING: Resource Timing Buffer is FULL!"); + performance.setResourceTimingBufferSize(200); +} +function init() { + // Set a callback if the resource buffer becomes filled + performance.onresourcetimingbufferfull = buffer_full; +} +<body onload="init()"></pre> + +<p>addEventListener() 関数を使用してハンドラを設定することもできます。</p> + +<pre class="brush: js">performance.addEventListener('resourcetimingbufferfull', buffer_full); +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Resource Timing', '#dom-performance-onresourcetimingbufferfull', 'onresourcetimingbufferfull')}}</td> + <td>{{Spec2('Resource Timing')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div>{{Compat("api.Performance.resourcetimingbufferfull_event")}}</div> + +<h2 id="あわせて参照">あわせて参照</h2> + +<ul> + <li>{{domxref("Performance.clearResourceTimings","Performance.clearResourceTimings()")}}</li> + <li>{{domxref("Performance.setResourceTimingBufferSize","Performance.setResourceTimingBufferSize()")}}</li> +</ul> diff --git a/files/ja/web/api/performance/setresourcetimingbuffersize/index.html b/files/ja/web/api/performance/setresourcetimingbuffersize/index.html new file mode 100644 index 0000000000..5c5e8fe2fc --- /dev/null +++ b/files/ja/web/api/performance/setresourcetimingbuffersize/index.html @@ -0,0 +1,78 @@ +--- +title: performance.setResourceTimingBufferSize() +slug: Web/API/Performance/setResourceTimingBufferSize +tags: + - API + - Web パフォーマンス + - メソッド + - リファレンス +translation_of: Web/API/Performance/setResourceTimingBufferSize +--- +<div>{{APIRef("Resource Timing API")}}</div> + +<p><strong><code>setResourceTimingBufferSize()</code></strong> メソッドは、ブラウザのリソースタイミングバッファサイズを、指定された数の "<code>resource</code>" {{domxref("PerformanceEntry.entryType","performance entry type")}} オブジェクトに設定します。</p> + +<p>ブラウザの推奨リソースタイミングバッファサイズは少なくとも 150 {{domxref("PerformanceEntry","performance entry")}} オブジェクトです。</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>performance</em>.setResourceTimingBufferSize(maxSize); +</pre> + +<h3 id="引数">引数</h3> + +<dl> + <dt>maxSize</dt> + <dd>ブラウザがパフォーマンスエントリバッファに保持する必要がある {{domxref("PerformanceEntry","performance entry")}} オブジェクトの最大数を表す <code>number</code>。</dd> +</dl> + +<h3 id="Return_Value" name="Return_Value">戻り値</h3> + +<dl> + <dt>なし</dt> + <dd>このメソッドには戻り値はありません。</dd> +</dl> + +<h2 id="例">例</h2> + +<pre class="brush: js">function setResourceTimingBufferSize(maxSize) { + if (performance === undefined) { + log("Browser does not support Web Performance"); + return; + } + var supported = typeof performance.setResourceTimingBufferSize == "function"; + if (supported) { + log("... Performance.setResourceTimingBufferSize() = Yes"); + performance.setResourceTimingBufferSize(maxSize); + } else { + log("... Performance.setResourceTimingBufferSize() = NOT supported"); + } +} +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Resource Timing', '#dom-performance-setresourcetimingbuffersize', 'setResourceTimingBufferSize()')}}</td> + <td>{{Spec2('Resource Timing')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.setResourceTimingBufferSize")}}</p> +</div> diff --git a/files/ja/web/api/performance/timeorigin/index.html b/files/ja/web/api/performance/timeorigin/index.html new file mode 100644 index 0000000000..8e0552fcf1 --- /dev/null +++ b/files/ja/web/api/performance/timeorigin/index.html @@ -0,0 +1,49 @@ +--- +title: Performance.timeOrigin +slug: Web/API/Performance/timeOrigin +tags: + - API + - Experimental + - High Resolution Time API + - timeOrigin + - パフォーマンス + - プロパティ + - リファレンス +translation_of: Web/API/Performance/timeOrigin +--- +<p>{{SeeCompatTable}}{{APIRef("High Resolution Time")}}</p> + +<p>{{domxref("Performance")}} インターフェイスの <strong><code>timeOrigin</code></strong> 読み取り専用プロパティは、パフォーマンス測定の開始時刻のハイレゾリューションタイムスタンプを返します。</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox">var <em>timeOrigin</em> = performance.timeOrigin</pre> + +<h3 id="値">値</h3> + +<p>ハイレゾリューションのタイムスタンプ</p> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + </tr> + <tr> + <td>{{SpecName('Highres Time Level 2','#dom-performance-timeorigin','timeOrigin')}}</td> + <td>{{Spec2('Highres Time Level 2')}}</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.timeOrigin")}}</p> +</div> diff --git a/files/ja/web/api/performance/timing/index.html b/files/ja/web/api/performance/timing/index.html new file mode 100644 index 0000000000..92356dcfe1 --- /dev/null +++ b/files/ja/web/api/performance/timing/index.html @@ -0,0 +1,58 @@ +--- +title: Performance.timing +slug: Web/API/Performance/timing +tags: + - API + - legacy + - ナビゲーションタイミング + - パフォーマンス + - プロパティ + - 後方互換性 + - 読み取り専用 + - 非推奨 +translation_of: Web/API/Performance/timing +--- +<p>{{APIRef("Navigation Timing")}}</p> + +<div class="warning"> +<p>このプロパティは <a href="https://w3c.github.io/navigation-timing/#obsolete">Navigation Timing Level 2 仕様</a>では非推奨です。代わりに {{domxref("Performance.timeOrigin")}} プロパティを使用してください。</p> +</div> + +<p>従来の <code><strong>Performance</strong></code><strong><code>.timing</code></strong> 読み取り専用プロパティは、待ち時間に関連するパフォーマンス情報を含む {{domxref("PerformanceTiming")}} オブジェクトを返します。</p> + +<p>このプロパティは Worker には使用できません。</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>timingInfo</em> = <em>performance</em>.timing;</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Navigation Timing', '#sec-window.performance-attribute', 'Performance.timing')}}</td> + <td>{{Spec2('Navigation Timing')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.timing")}}</p> +</div> + +<h2 id="あわせて参照">あわせて参照</h2> + +<ul> + <li>属している {{domxref("Performance")}} インターフェイス</li> +</ul> diff --git a/files/ja/web/api/performance/tojson/index.html b/files/ja/web/api/performance/tojson/index.html new file mode 100644 index 0000000000..0ced57f826 --- /dev/null +++ b/files/ja/web/api/performance/tojson/index.html @@ -0,0 +1,66 @@ +--- +title: performance.toJSON() +slug: Web/API/Performance/toJSON +tags: + - API + - パフォーマンス + - メソッド + - リファレンス +translation_of: Web/API/Performance/toJSON +--- +<div>{{APIRef("High Resolution Timing")}}</div> + +<p>{{domxref("Performance")}} インターフェイスの <strong><code>toJSON()</code></strong> メソッドは標準のシリアライザです。パフォーマンスオブジェクトのプロパティの JSON 表現を返します。</p> + +<p>{{availableinworkers}}</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox">myPerf = performance.toJSON() +</pre> + +<h3 id="引数">引数</h3> + +<dl> + <dt>なし</dt> + <dd> </dd> +</dl> + +<h3 id="戻り値">戻り値</h3> + +<dl> + <dt>myPerf</dt> + <dd>{{domxref("Performance")}} オブジェクトのシリアル化である JSON オブジェクト</dd> +</dl> + +<h2 id="例">例</h2> + +<pre class="brush: js">var js; +js = window.performance.toJSON(); +console.log("json = " + JSON.stringify(js)); +</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">ステータス</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Highres Time Level 2', '#dom-performance-tojson', 'toJSON() serializer')}}</td> + <td>{{Spec2('Highres Time Level 2')}}</td> + <td><code>toJson()</code>を定義します。</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザの互換性">ブラウザの互換性</h2> + +<div> +<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div> + +<p>{{Compat("api.Performance.toJSON")}}</p> +</div> |
