PerformanceResourceTiming.redirectEnd
redirectEnd
は読み取り専用プロパティで、最後のリダイレクトのレスポンスの最後のバイトを受信した直後に timestamp
を返します。
リソースを取得するとき、複数の HTTP リダイレクトがあり、いずれかのリダイレクトが現在のドキュメントとは異なる起点を持ち、タイミング許可チェックアルゴリズムがリダイレクトされたリソースごとに渡される場合、このプロパティは、最後のリダイレクトのレスポンスの最後のバイトを受信した直後の時間を返します。そうでなければ、ゼロが返されます。
リダイレクトの回数を取得する場合は、 PerformanceNavigationTiming.redirectCount
(en-US) も参照してください。
値
redirectEnd
プロパティは以下の値を取ります。
- 最後のリダイレクトのレスポンスの最後のバイトを受け取った直後の
timestamp
。 - リソースがキャッシュから即座に取得された場合は
0
です。 - リソースがオリジン間リクエストで取得され、HTTP の
Timing-Allow-Origin
レスポンスヘッダーが使用されなかった場合は0
となります。
例
リダイレクト時間の測定
redirectEnd
と redirectStart
プロパティを使用して、リダイレクトにどれだけ時間がかかったかを測定することができます。
js
const redirect = entry.redirectEnd - entry.redirectStart;
PerformanceObserver
を使用した例です。このオブジェクトは、新しい resource
パフォーマンス項目がブラウザーのパフォーマンスタイムラインに記録されると、それを通知します。オブザーバーが作成される前の項目にアクセスするために buffered
オプションを使用します。
js
const observer = new PerformanceObserver((list) => {
list.getEntries().forEach((entry) => {
const redirect = entry.redirectEnd - entry.redirectStart;
if (redirect > 0) {
console.log(`${entry.name}: Redirect time: ${redirect}ms`);
}
});
});
observer.observe({ type: "resource", buffered: true });
Performance.getEntriesByType()
を使用した例です。このメソッドを呼び出した時点でブラウザー上のパフォーマンスタイムラインに存在する resource
パフォーマンス項目のみを表示します。
js
const resources = performance.getEntriesByType("resource");
resources.forEach((entry) => {
const redirect = entry.redirectEnd - entry.redirectStart;
if (redirect > 0) {
console.log(`${entry.name}: Redirect time: ${redirect}ms`);
}
});
オリジン間のタイミング情報
redirectStart
プロパティの値が 0
である場合、そのリソースはオリジン間リクエストである可能性があります。オリジン間のタイミング情報を見るためには、HTTP の Timing-Allow-Origin
レスポンスヘッダーを設定する必要があります。
例えば、https://developer.mozilla.org
にタイミングリソースを見ることを許可するには、オリジン間リソースで次のものを送信する必要があります。
http
Timing-Allow-Origin: https://developer.mozilla.org
仕様書
Specification |
---|
Resource Timing # dom-performanceresourcetiming-redirectend |
ブラウザーの互換性
BCD tables only load in the browser