3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

Chromeデベロッパーツール NetworkのTimingセクションの見方

Posted at

Google Chromeの開発者ツールの「Network」タブの「Timing」セクションは、リクエストのライフサイクルの各段階での時間を視覚的に示しています。以下は、このセクションで表示される主な項目とその説明です

スクリーンショット 2023-09-15 0.25.31.png

  1. Queued / Stalled / Blocking:

    • Queued: リクエストが開始されるまでの待機時間。
    • Stalled/Blocking: リクエストが開始される前に発生する遅延。これは、既存の接続が再利用されるのを待っているか、CORSプリフライトリクエストがある場合などに発生します。
  2. DNS Lookup:

    • ドメイン名のIPアドレスへの解決にかかった時間。キャッシュされている場合、この時間は非常に短くなることがあります。
  3. Initial Connection / Connecting:

    • TCPハンドシェイクにかかった時間。これには、TCPの3ウェイハンドシェイクや、再接続の場合のTCPの再利用も含まれます。
  4. SSL / TLS Negotiation:

    • SSL/TLSハンドシェイクにかかった時間。安全な接続の確立に必要な時間です。
  5. Request Sent / Sending:

    • リクエストデータが送信されるのにかかった実際の時間。
  6. Waiting (TTFB: Time To First Byte):

    • 最初のバイトを受信するまでの時間。これは、サーバーがリクエストを処理して応答を開始するまでの時間を示しています。
  7. Content Download / Downloading:

    • 応答データをダウンロードするのにかかった時間。

「Timing」セクションのバーは色分けされており、各段階の時間を視覚的に理解するのに役立ちます。これらの情報を使用して、リクエストのどの段階で遅延が発生しているかを特定し、パフォーマンスの最適化のための手がかりを得ることができます。

3
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?