このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

レイテンシーを理解する

レイテンシーとは、データパケットがソースから出力先まで到達するまでの時間を指します。パフォーマンス最適化の観点では、レイテンシーの発生原因を縮小する最適化と、低速な接続環境のユーザー向けに最適化するため、高レイテンシーをエミュレートしたサイト性能検査が重要です。この記事では、レイテンシーの定義、パフォーマンスへの影響、測定方法、縮小手法について解説します。

レイテンシーとは何か

レイテンシーとは一般的に、ユーザーがリクエストを送信してからレスポンスがユーザーに届くまでの時間を指します。最初のリクエストでは、最初の14KBバイトにおいてレイテンシーが長くかかるのは、 DNS 参照、TCP ハンドシェイク、そして保護された TLS ネゴシエーションが含まれるためです。その後のリクエストでは、サーバーへの接続が既に確立されているため、レイテンシーは短くなります。

レイテンシーとは、ネットワークまたはインターネット接続における遅延の量を説明する概念です。低レイテンシーは、遅延がほとんどない、あるいは全くないことを意味します。高レイテンシーは、遅延が多いことを意味します。パフォーマンスを改善する主な目的の一つは、レイテンシーを縮小することです。

単一の資産、特に基本的な HTML ページに関連付けられた遅延は、些細なものに見えるかもしれません。しかし、ウェブサイトは通常、複数のリクエストを伴います。 HTML は複数の CSS、スクリプト、メディアファイルへのリクエストを記載します。これらのリクエストの数値とサイズが大きくなるほど、高い遅延が使い勝手にもたらす影響も大きくなります。

低レイテンシーの接続では、リクエストされたリソースはほぼ瞬時に現れます。高レイテンシーの接続では、リクエストが送信された時点からリソースが返されるまでに、明白な遅延があります。データの移される速度を測定することで、レイテンシーの大きさを特定できます。

レイテンシーは、例えばリソースのリクエスト送信にかかる時間、あるいはブラウザーがリソースをリクエストしてから要求されたリソースがブラウザーに到達するまでの全往復時間といった方法で測定できます。

ネットワークスロットリング

低帯域幅ネットワークのレイテンシーをエミュレートするには、開発者ツールを使用して、低速なネットワーク接続に切り替えることができます。

スロットリングをエミュレートすることでレイテンシーをエミュレートする

開発者ツールのネットワーク表では、スロットリングオプションを2G、3Gなどに切り替えられます。ブラウザーの開発者ツールによってプリセットオプションは異なり、エミュレートされる特性にはダウンロード速度、アップロード速度、最小レイテンシー(データパケット送信に要する最小時間)などが記載されます。一部のプリセットのおおよその値は以下の通りです。

選択肢 ダウンロード速度 アップロード速度 最小レイテンシー (ms)
GPRS 50 kbps 20 kbps 500
Regular 2G 250 kbps 50 kbps 300
Good 2G 450 kbps 150 kbps 150
Regular 3G 750 kbps 250 kbps 100
Good 3G 1.5 Mbps 750 kbps 40
Regular 4G/LTE 4 Mbps 3 Mbps 20
DSL 2 Mbps 1 Mbps 5
Wi-Fi 30 Mbps 15 Mbps 2

ネットワークタイミング

また、ネットワークタブでは、それぞれのリクエストが完了するまでに要した時間を確認できます。 267.5KB の SVG 画像資産のダウンロードにどれだけの時間がかかったかを見ていきましょう。

大規模な SVG 資産が読み込まれるまでに要した時間。

リクエストがキューに待機し、ネットワーク接続を待っている状態はブロックとみなされます。ブロック状態は、単一のサーバーに対してHTTP経由で同時に確立される接続が多すぎる場合に発生し、すべての接続が使用中の場合、ブラウザーは接続が解放されるまで追加のリソースをダウンロードできず、それらはブロックされた状態であるということを意味します。

DNS 解決とは、 DNS の検索に要した時間です。ホスト名の数が多いほど、より多くの DNS 検索が必要である。

接続とは、TCP ハンドシェイクが完了するまでに要する時間です。 DNS と同様に、サーバー接続を作成するために必要な数値が多いほど、サーバー接続の作成に費やす時間も長くなります。

TLS ハンドシェイクは、保護された接続が設定されるのにかかる時間です。 TLS ハンドシェイクは安全でない接続よりも接続に詳しい時間がかかりますが、保護された接続に必要な追加の時間はそれだけの価値があります。

送信は、 HTTP リクエストをサーバーに送信するのにかかる時間です。

待機とはディスクレイテンシー、つまりサーバーがレスポンスを完成させるまでに要した時間です。かつてはディスクレイテンシーがパフォーマンス上の主な懸念事項でした。しかし、コンピューターのメモリーや CPU の性能向上に伴い、サーバーのパフォーマンスは改善されています。サーバーに要求される処理の複雑さによっては、これは今でも課題となる可能性があります。

受信とは、資産をダウンロードするまでに要する時間です。受信時点は、ネットワーク容量と資産のファイルサイズとの組み合わせによって決まります。画像がキャッシュされていた場合、これはほぼ瞬時に行われたでしょう。スロットル処理を行っていた場合、受信にかかる時間は 43 秒にも及んでいた可能性があります!

レイテンシーの測定

ネットワークレイテンシーとは、データリクエストがリクエスト元のコンピューターから応答するコンピューターに取得するまでの時間を指します。これには、応答元のコンピューターからリクエスト元のコンピューターへデータバイトが戻るまでの時間を含みます。一般的に往復遅延時間として測定されます。

ディスクレイテンシーとは、コンピューター(通常はサーバー)がリクエストを受信した時点から、そのコンピューターがレスポンスを返すまでの時間を指します。