Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from http://developer.mozilla.org/ja/docs/Web/API/PerformanceResourceTiming/connectEnd below:

PerformanceResourceTiming.connectEnd - Web API | MDN

Baseline Widely available

connectEnd は読み取り専用プロパティで、ブラウザーがリソースを取得するためにサーバーへの接続を確立し終わった直後の timestamp を返します。このタイムスタンプ値には、トランスポート接続を確立するための時間、TLS ハンドシェイクや SOCKS 認証などの他の時間が含まれます。

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

• 接続が確立された後の時間を表す DOMHighResTimeStamp。
• リソースがキャッシュから即座に取得された場合は 0 です。
• リソースがオリジン間リクエストで取得され、HTTP の Timing-Allow-Origin レスポンスヘッダーが使用されなかった場合は 0 となります。

connectEnd と connectStart プロパティを使用して、 TCP ハンドシェイクが発生したときにどれくらいかかるかを計測することができます。

const tcp = entry.connectEnd - entry.connectStart;

PerformanceObserver を使用した例です。このオブジェクトは、新しい resource パフォーマンス項目がブラウザーのパフォーマンスタイムラインに記録されると、それを通知します。オブザーバーが作成される前の項目にアクセスするために buffered オプションを使用します。

const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    const tcp = entry.connectEnd - entry.connectStart;
    if (tcp > 0) {
      console.log(`${entry.name}: TCP handshake duration: ${tcp}ms`);
    }
  });
});

observer.observe({ type: "resource", buffered: true });

Performance.getEntriesByType() を使用した例です。このメソッドを呼び出した時点でブラウザー上のパフォーマンスタイムラインに存在する resource パフォーマンス項目のみを表示します。

const resources = performance.getEntriesByType("resource");
resources.forEach((entry) => {
  const tcp = entry.connectEnd - entry.connectStart;
  if (tcp > 0) {
    console.log(`${entry.name}: TCP handshake duration: ${tcp}ms`);
  }
});

connectEnd プロパティの値が 0 である場合、そのリソースはオリジン間リクエストである可能性があります。オリジン間のタイミング情報を見るためには、HTTP の Timing-Allow-Origin レスポンスヘッダーを設定する必要があります。

例えば、https://developer.mozilla.org にタイミングリソースを見ることを許可するには、オリジン間リソースで次のものを送信する必要があります。

Timing-Allow-Origin: https://developer.mozilla.org

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4