diff options
Diffstat (limited to 'files/ja/web/api/performancenavigationtiming')
-rw-r--r-- | files/ja/web/api/performancenavigationtiming/index.html | 108 | ||||
-rw-r--r-- | files/ja/web/api/performancenavigationtiming/loadeventend/index.html | 74 |
2 files changed, 182 insertions, 0 deletions
diff --git a/files/ja/web/api/performancenavigationtiming/index.html b/files/ja/web/api/performancenavigationtiming/index.html new file mode 100644 index 0000000000..894ce73c79 --- /dev/null +++ b/files/ja/web/api/performancenavigationtiming/index.html @@ -0,0 +1,108 @@ +--- +title: PerformanceNavigationTiming +slug: Web/API/PerformanceNavigationTiming +tags: + - API + - Interface + - Navigation Timing API + - Performance Timeline API + - Reference + - Web Performance +translation_of: Web/API/PerformanceNavigationTiming +--- +<p>{{APIRef("Navigation Timing")}}{{SeeCompatTable}}</p> + +<p><span class="seoSummary"><strong><code>PerformanceNavigationTiming</code></strong> インターフェイスは、ブラウザーの文書ナビゲーションイベントに関するメトリックを格納および取得するためのメソッドとプロパティを提供します。たとえば、このインターフェイスを使用して、文書のロードまたはアンロードにかかる時間を判断できます。</span></p> + +<p>{{InheritanceDiagram}}</p> + +<h2 id="Properties" name="Properties">プロパティ</h2> + +<p>このインターフェイスは、ナビゲーションパフォーマンスエントリタイプの以下の {{domxref('PerformanceEntry')}} プロパティを次のように限定して制限することで拡張します。</p> + +<dl> + <dt>{{domxref("PerformanceEntry.entryType")}} {{readonlyInline}}</dt> + <dd><code>"navigation"</code> を返します。</dd> + <dt>{{domxref("PerformanceEntry.name")}} {{readonlyInline}}</dt> + <dd><a href="https://dom.spec.whatwg.org/#concept-document-url">文書のアドレス</a> を返します。</dd> + <dt>{{domxref("PerformanceEntry.startTime")}} {{readonlyInline}}</dt> + <dd>値 "<code>0</code>" を持つ {{domxref("DOMHighResTimeStamp")}} を返します。</dd> + <dt>{{domxref("PerformanceEntry.duration")}} {{readonlyInline}}</dt> + <dd>{{domxref("PerformanceNavigationTiming.loadEventEnd")}} と {{domxref("PerformanceEntry.startTime")}} の各プロパティの差である {{domxref("DOMHighResTimeStamp","timestamp")}} を返します。</dd> +</dl> + +<p>このインターフェイスは、ナビゲーションパフォーマンスエントリタイプの以下の {{domxref('PerformanceResourceTiming')}} プロパティも、次のように修飾して制約することで拡張します。</p> + +<dl> + <dt>{{domxref('PerformanceResourceTiming.initiatorType')}}{{readonlyInline}}</dt> + <dd><code>"navigation"</code> を返します。</dd> +</dl> + +<p>インターフェイスは以下のプロパティもサポートします。</p> + +<dl> + <dt>{{domxref('PerformanceNavigationTiming.domComplete')}} {{readonlyInline}} </dt> + <dd>ブラウザーが現在の文書の現在の文書レディネスを<em><a href="https://html.spec.whatwg.org/multipage/syntax.html#the-end">完了</a></em>に設定する直前の時間と等しい時間値を表す {{domxref("DOMHighResTimeStamp")}}。</dd> + <dt>{{domxref('PerformanceNavigationTiming.domContentLoadedEventEnd')}} {{readonlyInline}}</dt> + <dd>現在の文書の <a href="https://html.spec.whatwg.org/multipage/syntax.html#the-end">DOMContentLoaded</a> イベントが完了した直後の時間と等しい時間値を表す {{domxref("DOMHighResTimeStamp")}}。</dd> + <dt>{{domxref('PerformanceNavigationTiming.domContentLoadedEventStart')}} {{readonlyInline}}</dt> + <dd>現在の文書でユーザーエージェントが <a href="https://html.spec.whatwg.org/multipage/syntax.html#the-end">DOMContentLoaded</a> イベントを起動する直前の時間と等しい時間値を表す {{domxref("DOMHighResTimeStamp")}}。</dd> + <dt>{{domxref('PerformanceNavigationTiming.domInteractive')}} {{readonlyInline}} </dt> + <dd>ユーザーエージェントが現在の文書の現在の文書の準備状態を <a href="https://html.spec.whatwg.org/multipage/syntax.html#the-end">interactive</a> に設定する直前の時間に等しい時間値を表す{{domxref("DOMHighResTimeStamp","タイムスタンプ")}}を表す {{domxref("DOMHighResTimeStamp")}}。</dd> + <dt>{{domxref('PerformanceNavigationTiming.loadEventEnd')}} {{readonlyInline}} </dt> + <dd>現在の文書の load イベントが完了した時刻を表す {{domxref("DOMHighResTimeStamp")}}。</dd> + <dt>{{domxref('PerformanceNavigationTiming.loadEventStart')}} {{readonlyInline}} </dt> + <dd>現在の文書の load イベントが発生する直前の時間と等しい時間値を表す {{domxref("DOMHighResTimeStamp")}}。</dd> + <dt>{{domxref('PerformanceNavigationTiming.redirectCount')}} {{readonlyInline}} </dt> + <dd>現在の閲覧コンテキストでの最後のリダイレクト以外のナビゲーション以降のリダイレクト数を表す数値。</dd> + <dd>リダイレクトがなかった場合、またはリダイレクトが別のオリジンからのもので、そのオリジンが現在のオリジンにタイミング情報を公開することを許可していない場合、値は 0 になります。</dd> + <dt>{{domxref('PerformanceNavigationTiming.requestStart')}} {{readonlyInline}} </dt> + <dd>ユーザーエージェントがサーバー、または関連するアプリケーションキャッシュから、あるいはローカルリソースからリソースを要求し始める直前の時間を表す {{domxref("DOMHighResTimeStamp")}}。</dd> + <dt>{{domxref('PerformanceNavigationTiming.responseStart')}} {{readonlyInline}} </dt> + <dd>ユーザーエージェントの HTTP パーサーが関連するアプリケーションキャッシュ、またはローカルリソースから、あるいはサーバーからレスポンスの最初のバイトを受け取った直後の時間を表す {{domxref("DOMHighResTimeStamp")}}。</dd> + <dt>{{domxref('PerformanceNavigationTiming.type')}} {{readonlyInline}} </dt> + <dd>ナビゲーションタイプを表す {{domxref("DOMString","文字列")}}。"<code>navigate</code>"、"<code>reload</code>"、"<code>back_forward</code>"、"<code>prerender</code>"のいずれかです。</dd> + <dt>{{domxref('PerformanceNavigationTiming.unloadEventEnd')}} {{readonlyInline}} </dt> + <dd>ユーザーエージェントが前の文書の unload イベントを終了した直後の時間と等しい時間値を表す {{domxref("DOMHighResTimeStamp")}}。</dd> + <dt>{{domxref('PerformanceNavigationTiming.unloadEventStart')}} {{readonlyInline}} </dt> + <dd>ユーザーエージェントが前の文書の unload イベントを開始する直前の時間と等しい時間値を表す {{domxref("DOMHighResTimeStamp")}}。</dd> +</dl> + +<h2 id="Methods" name="Methods">メソッド</h2> + +<dl> + <dt>{{domxref("PerformanceNavigationTiming.toJSON()")}}</dt> + <dd>{{domxref("PerformanceNavigationTiming")}} オブジェクトの JSON 表現である {{domxref("DOMString")}} を返します。</dd> +</dl> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">状態</th> + <th scope="col">備考</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Navigation Timing Level 2', '#sec-PerformanceNavigationTiming', 'PerformanceNavigationTiming')}}</td> + <td>{{Spec2('Navigation Timing Level 2')}}</td> + <td>初回定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、<a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("api.PerformanceNavigationTiming")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{domxref("Performance.navigation")}}</li> + <li>{{domxref("PerformanceNavigation")}}</li> +</ul> diff --git a/files/ja/web/api/performancenavigationtiming/loadeventend/index.html b/files/ja/web/api/performancenavigationtiming/loadeventend/index.html new file mode 100644 index 0000000000..3c3bf7a878 --- /dev/null +++ b/files/ja/web/api/performancenavigationtiming/loadeventend/index.html @@ -0,0 +1,74 @@ +--- +title: PerformanceNavigationTiming.loadEventEnd +slug: Web/API/PerformanceNavigationTiming/loadEventEnd +tags: + - API + - Web パフォーマンス + - プロパティ + - リファレンス +translation_of: Web/API/PerformanceNavigationTiming/loadEventEnd +--- +<div>{{APIRef("Navigation Timing")}}{{SeeCompatTable}}</div> + +<p><strong><code>loadEventEnd</code></strong> 読み取り専用プロパティは、現在のドキュメントのロードイベントが完了した時刻と同じ{{domxref("DOMHighResTimeStamp","timestamp")}} を返します。</p> + +<h2 id="構文">構文</h2> + +<pre class="syntaxbox"><em>perfEntry</em>.loadEventEnd; +</pre> + +<h3 id="戻り値">戻り値</h3> + +<p>現在のドキュメントのロードイベントが完了した時刻を表す {{domxref("DOMHighResTimeStamp","timestamp")}}。</p> + +<h2 id="例">例</h2> + +<p>次の例は、このプロパティの使用方法を示しています。</p> + +<pre class="brush: js">function print_nav_timing_data() { + // Use getEntriesByType() to just get the "navigation" events + var perfEntries = performance.getEntriesByType("navigation"); + + for (var i=0; i < perfEntries.length; i++) { + console.log("= Navigation entry[" + i + "]"); + var p = perfEntries[i]; + // dom Properties + console.log("DOM content loaded = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart)); + console.log("DOM complete = " + p.domComplete); + console.log("DOM interactive = " + p.interactive); + + // document load and unload time + console.log("document load = " + (p.loadEventEnd - p.loadEventStart)); + console.log("document unload = " + (p.unloadEventEnd - p.unloadEventStart)); + + // other properties + console.log("type = " + p.type); + console.log("redirectCount = " + p.redirectCount); + } +} +</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 Level 2', '#widl-PerformanceNavigationTiming-loadEventEnd', 'loadEventEnd')}}</td> + <td>{{Spec2('Navigation Timing Level 2')}}</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.PerformanceNavigationTiming.loadEventEnd")}}</p> +</div> |