PerformanceResourceTiming.redirectEnd

redirectEnd は読み取り専用プロパティで、最後のリダイレクトのレスポンスの最後のバイトを受信した直後に timestamp を返します。

リソースを取得するとき、複数の HTTP リダイレクトがあり、いずれかのリダイレクトが現在のドキュメントとは異なる起点を持ち、タイミング許可チェックアルゴリズムがリダイレクトされたリソースごとに渡される場合、このプロパティは、最後のリダイレクトのレスポンスの最後のバイトを受信した直後の時間を返します。そうでなければ、ゼロが返されます。

リダイレクトの回数を取得する場合は、 PerformanceNavigationTiming.redirectCount (en-US) も参照してください。

redirectEnd プロパティは以下の値を取ります。

  • 最後のリダイレクトのレスポンスの最後のバイトを受け取った直後の timestamp
  • リソースがキャッシュから即座に取得された場合は 0 です。
  • リソースがオリジン間リクエストで取得され、HTTP の Timing-Allow-Origin レスポンスヘッダーが使用されなかった場合は 0 となります。

リダイレクト時間の測定

redirectEndredirectStart プロパティを使用して、リダイレクトにどれだけ時間がかかったかを測定することができます。

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

関連情報