web-dev-qa-db-ja.com

一部のリソースでChromeがH2の代わりにHttp / 1.1を使用するのはなぜですか

現在、WebサイトでH2を有効にしています。テスト中に、一部のリソースはHttp /1.1で要求され、他のほとんどのリソースはH2で要求されているように見えることがわかりました。興味深いことに、同じリソースが1つのパスを介して要求された場合、http/1.1を使用しているように見え、別の時点でH2を使用しているように見えます。

  • 私はChromeバージョン58.0.3029.96(64ビット)をOSX Sierraで実行し、シークレットモードで実行しています
  • 両方のリソースが同じオリジンから要求されます。

以下のリソースのChrome開発者ツールのスクリーンショットを参照してください。

enter image description here

さらに、http /1.1を使用して要求される他のリソースはほとんどありません。なぜこれが起こっているのかについてのアイデアはありますか?また、http/2からhttp/1.1に切り替えると、同じ接続が再利用されているように見えますが、これも行頭ブロッキングの問題を引き起こしている可能性がありますか?

enter image description here

enter image description here

ここでの助けをいただければ幸いです!

8
mithrandir

あなたがスクリーンショットで与えた限られた情報に基づいて、HTTP/1.1が時々使用される理由を説明することはできませんが、他の理由は説明できません。

それらが両方とも同じ起源であると100%確信していますか?リソースはおそらくキャッシュから提供されており、HTTP/1.1でキャッシュされていましたか?

別の点で、それが間違っているように見えるのに、なぜ同じページのロード内で同じソースを2回要求するのですか?変更されるデータ(JSONリクエストなど)には十分ですが、jquery-UIを複数回ロードする理由、または実行しているように見える同じcssファイルをロードする理由がわかりませんか?非常に奇妙なユースケースのようです。少なくとも、再度使用するにはキャッシュする必要があります。

2番目の質問では、HTTP/2では、同じ接続が同じオリジンに再利用されます(これには、同じIPアドレスに同じhttps証明書を持つ別のvhostがある場合、特定のユースケースで同じエフェクトオリジンが含まれます)。 HTTP/2プロトコルはこのシナリオ用に特別に設計されており、多重化を使用してリクエストを混合するため、これはnotではありません。

ただし、これにより、クライアント、サーバー、および帯域幅に応じて、開発ツールでのリクエストの表示方法のプロファイルが変更されます。たとえば、ダウンロードに5秒かかる2つのリソースのリクエストがあるとします。 HTTP/1.1では、次のように表示されます。

Request 1: start 0 seconds, end 5 seconds.
Request 2: start 5 seconds, end 10 seconds.
Total time to download could be calculated as: 5s + 5s = 10s
Overall Page load time would be 10 seconds

HTTP/2では、次のように表示される場合があります(最初のリクエストが最初に完全に返送されることが優先されたと仮定)。

例2a

Request 1: start 0 seconds, end 5 seconds.
Request 2: start 0 seconds, end 10 seconds.
Total time **looks** be 5s + 10s = 15s
Overall Page load time would still be 10 seconds

または、飛行中の両方のリクエストを同時に処理するのに十分な帯域幅があり、サーバーが最初のリクエストより1秒遅れて2番目のリクエストで応答する場合は、次のようになります。

例2b

Request 1: start 0 seconds, end 5 seconds.
Request 2: start 0 seconds, end 6 seconds.
Total time **looks** be 5s + 6s = 11s
Overall Page load time would be 6 seconds

例2aの合計時間は同じですが、部分を合計しようとすると、HTTP/2ではポイントの「見た目」が遅くなり、実際には例2bでは4秒速くなります。 HTTP /1.1とHTTP/2の間で、開発者ツールの同様のベースの個々のリクエストを比較することはできません。

これは、複数のHTTP/1.1リクエストを比較するのと同じ方法です(ブラウザは通常、ホストごとに1つではなく4〜8の接続を開きます)が、プロトコルに組み込まれているため、HTTP/2で複数の接続を開いて管理するオーバーヘッドがない点が異なります。また、HTTP/2では4〜8の制限はありません。ブラウザやサーバーを介して、多くの場合1つが実装されます たとえば、Apacheのデフォルトは100です )。

HTTP/2を最大限に活用するために、クライアントとサーバーの両方でまだ多くの最適化が行われていると私はまだ思っています。インターネットはHTTP/1.1とその仕組みについても大幅に最適化されているため、HTTP/2を最大限に活用するには、これらのいくつかを元に戻すか、少なくとも調整する必要があります。たとえば、ページの読み込みでは通常、HTML、CSS、画像の順に読み込まれますが、これは当然優先順位につながります。 HTTP/2では、すべてのアセットを同時にリクエストできますが、実際には、たとえば画像よりもCSSを優先する必要があります。ほとんどのブラウザはこれを行いますが、最適な方法で行いますか?

3
Barry Pollard