Skip to content
Sign in
Artwork for 八百万のOSS
八百万のOSS · June 30 · 1 hr 10 min

#9 HTTP/2で速くなった、はずだった —— HTTP/3との違いとCDN利用の現実

HTTP/2とHTTP/3は、Webを速く、安定して使うために出てきたプロトコルです。ただし「HTTP/3はHTTP/2より常に速い」という単純な話ではありません。 今回は、HTTP/1.1で同じホストに複数TCP接続を張っていた時代から、SPDYを経てHTTP/2が生まれ、HTTP/3では何が変わったのかまでを整理します。 HTTP/2は、1本のTCP接続で複数のリクエスト・レスポンスをストリームとして多重化し、HTTP/1.1にあったHTTPレイヤーのHead-of-Line Blockingを改善しました。HPACKによるヘッダー圧縮、ALPNによる`h2`と`http/1.1`の切り替え、仕様上は平文の`h2c`もあるがブラウザ向けWebでは実質HTTPS前提になっていること、nginxでは現在`http2 on;`で有効化することも扱います。 一方でHTTP/2はTCPの上で動くため、TCP由来のHead-of-Line Blockingは残ります。パケットロスが起きると、1本のTCP接続に多重化された複数ストリームがまとめて影響を受けることがあります。HTTP/3はUDPを使うことで、このTCP由来の問題を避けやすくしようとしたプロトコルです。 ただしHTTP/3は完全上位互換ではありません。安定した低遅延・低ロス環境ではHTTP/2と大差ないこともあり、データセンター間通信のような安定したネットワークでは通常HTTP/3は使いません。効きやすいのは、モバイル回線、海外通信、高RTT、パケットロスのあるような不安定なエンドユーザー回線です。 導入面では、HTTP/3はHTTP/2のように同じTCP接続上で自然に切り替わるわけではなく、`Alt-Svc: h3=":443"`やHTTPS RRで「このオリジンはHTTP/3も使える」と知らせます。失敗すればHTTP/2やHTTP/1.1にフォールバックするため、実運用では共存が前提です。 nginxでのHTTP/2はかなり実用上枯れてきており、ブラウザ向けHTTPSでは有効化しやすい選択肢です。一方でHTTP/3はアプリケーション側で実装・制御する範囲が大きく、自前で扱うのは大変です。現実的にはCDN側でHTTP/3を有効化し、CDN-Origin間やデータセンター間通信はHTTP/1.1やHTTP/2のままにする構成が普通です。 OSS、ブラウザ、サーバー、CDN、標準化が絡み合ってHTTPが進化してきた話として、HTTP/2とHTTP/3の違いを見ていきます。 - HTTP/2 (RFC 9113): https://www.rfc-editor.org/rfc/rfc9113 - HTTP/3 (RFC 9114): https://www.rfc-editor.org/rfc/rfc9114 - HPACK / HTTP/2ヘッダー圧縮 (RFC 7541): https://www.rfc-editor.org/rfc/rfc7541 - TLS 1.3 (RFC 8446): https://www.rfc-editor.org/rfc/rfc8446 - ALPN (RFC 7301): https://www.rfc-editor.org/rfc/rfc7301 - Alt-Svc ヘッダー (RFC 7838): https://www.rfc-editor.org/rfc/rfc7838 - SVCB / HTTPSリソースレコード (RFC 9460): https://www.rfc-editor.org/rfc/rfc9460 - SPDY (Chromium): https://www.chromium.org/spdy/ - nginx: https://nginx.org/ - nginx HTTP/2 module: https://nginx.org/en/docs/http/ngx_http_v2_module.html - curl: https://curl.se/ - nghttp2: https://nghttp2.org/ - OpenSSL: https://www.openssl.org/ - Next.js: https://nextjs.org/ - webpack: https://webpack.js.org/ - jQuery: https://jquery.com/ - Cloudflare: https://www.cloudflare.com/ - さくらのVPS: https://vps.sakura.ad.jp/ - AWS: https://aws.amazon.com/ ───────────── YouTube: https://youtu.be/pOth4rhg3M8 Web: https://yaoyorozu-oss.henteko07.com/ X: https://x.com/yaoyorozu_oss

0:00-1:10:57
Play in

transcript

No transcript — this publisher did not publish one.

show notes

HTTP/2とHTTP/3は、Webを速く、安定して使うために出てきたプロトコルです。ただし「HTTP/3はHTTP/2より常に速い」という単純な話ではありません。


今回は、HTTP/1.1で同じホストに複数TCP接続を張っていた時代から、SPDYを経てHTTP/2が生まれ、HTTP/3では何が変わったのかまでを整理します。


HTTP/2は、1本のTCP接続で複数のリクエスト・レスポンスをストリームとして多重化し、HTTP/1.1にあったHTTPレイヤーのHead-of-Line Blockingを改善しました。HPACKによるヘッダー圧縮、ALPNによる`h2`と`http/1.1`の切り替え、仕様上は平文の`h2c`もあるがブラウザ向けWebでは実質HTTPS前提になっていること、nginxでは現在`http2 on;`で有効化することも扱います。


一方でHTTP/2はTCPの上で動くため、TCP由来のHead-of-Line Blockingは残ります。パケットロスが起きると、1本のTCP接続に多重化された複数ストリームがまとめて影響を受けることがあります。HTTP/3はUDPを使うことで、このTCP由来の問題を避けやすくしようとしたプロトコルです。


ただしHTTP/3は完全上位互換ではありません。安定した低遅延・低ロス環境ではHTTP/2と大差ないこともあり、データセンター間通信のような安定したネットワークでは通常HTTP/3は使いません。効きやすいのは、モバイル回線、海外通信、高RTT、パケットロスのあるような不安定なエンドユーザー回線です。


導入面では、HTTP/3はHTTP/2のように同じTCP接続上で自然に切り替わるわけではなく、`Alt-Svc: h3=":443"`やHTTPS RRで「このオリジンはHTTP/3も使える」と知らせます。失敗すればHTTP/2やHTTP/1.1にフォールバックするため、実運用では共存が前提です。


nginxでのHTTP/2はかなり実用上枯れてきており、ブラウザ向けHTTPSでは有効化しやすい選択肢です。一方でHTTP/3はアプリケーション側で実装・制御する範囲が大きく、自前で扱うのは大変です。現実的にはCDN側でHTTP/3を有効化し、CDN-Origin間やデータセンター間通信はHTTP/1.1やHTTP/2のままにする構成が普通です。


OSS、ブラウザ、サーバー、CDN、標準化が絡み合ってHTTPが進化してきた話として、HTTP/2とHTTP/3の違いを見ていきます。


- HTTP/2 (RFC 9113): https://www.rfc-editor.org/rfc/rfc9113

- HTTP/3 (RFC 9114): https://www.rfc-editor.org/rfc/rfc9114

- HPACK / HTTP/2ヘッダー圧縮 (RFC 7541): https://www.rfc-editor.org/rfc/rfc7541

- TLS 1.3 (RFC 8446): https://www.rfc-editor.org/rfc/rfc8446

- ALPN (RFC 7301): https://www.rfc-editor.org/rfc/rfc7301

- Alt-Svc ヘッダー (RFC 7838): https://www.rfc-editor.org/rfc/rfc7838

- SVCB / HTTPSリソースレコード (RFC 9460): https://www.rfc-editor.org/rfc/rfc9460

- SPDY (Chromium): https://www.chromium.org/spdy/

- nginx: https://nginx.org/

- nginx HTTP/2 module: https://nginx.org/en/docs/http/ngx_http_v2_module.html

- curl: https://curl.se/

- nghttp2: https://nghttp2.org/

- OpenSSL: https://www.openssl.org/

- Next.js: https://nextjs.org/

- webpack: https://webpack.js.org/

- jQuery: https://jquery.com/

- Cloudflare: https://www.cloudflare.com/

- さくらのVPS: https://vps.sakura.ad.jp/

- AWS: https://aws.amazon.com/


─────────────

YouTube: https://youtu.be/pOth4rhg3M8

Web: https://yaoyorozu-oss.henteko07.com/

X: https://x.com/yaoyorozu_oss

more episodes

All episodes