UGA Boxxx

つぶやきの延長のつもりで、知ったこと思ったこと書いてます

【Web高速化】サーバープッシュとは?

サーバープッシュという機能を使ったWeb高速化の話を聞いたので概要を調査してみた

サーバープッシュ

HTTP/2のプロトコルでの通信において、サーバーがクライアントに対して事前にレスポンスを送信(プッシュ)できるようにしておくこと

HTTP/2での通信は単一のTCP接続で動作するため、1回の通信でリクエストとレスポンスの少なくとも1往復分の時間がかかってしまう
そこでリクエストを待たずにサーバからクライアントにデータを送りつけれるようにしておこうというのがサーバプッシュの仕組み

具体的には

f:id:uggds:20200510232240p:plain

  1. Stream ID = 1 を介してクライアントからリクエスト(/index.html)を送信
  2. リクエストを受け取ったサーバーは要求のあったファイルを返す前に、事前にStream ID = 2で別のファイルを送信することをクライアント側に通知しておく
  3. サーバーは元々要求のあったファイルと事前に通知しておいたファイルをそれぞれのStream1と2を使ってレスポンスする

視覚的なレンダリングに必要なアセットを事前にプッシュしておくことでFMP(First Meaningful Paint)に寄与すると考えられている

課題

サーバープッシュを使えばWeb高速化につながる可能性があるが、以下のような課題がある

  • 全てのコンテンツをプッシュすると逆に遅くなる場合がある
  • クライアントにキャッシュがある場合にプッシュしない(または更新するためにプッシュする)などの制御が必要

全てのコンテンツをプッシュすると逆に遅くなる場合がある

ユーザー体験をよくする最低限のリソース(CSSなど)だけに抑えていないと無駄なリソースを取得することになるため、余計なネットワークコストがかかって遅くなる場合がある

クライアントにキャッシュがある場合にプッシュしない制御が必要

すでにクライアント側にキャッシュがある場合はわざわざコンテンツを取得する必要はないため、プッシュしないように制御する必要がある

まとめ

サーバープッシュはWeb高速化につながる可能性があるが、逆に遅くなる可能性もあるため細かな制御が必要であることがわかった

※参考

https://summerwind.jp/docs/rfc7540/#section5-1-1

https://www.publickey1.jp/blog/16/httpdevelopers_summit_2016.html

https://blog.redbox.ne.jp/http2-server-push-cdn.html