HTTP/2

HTTP/2とは？

HTTP/2とHTTP/1.1の比較

HTTP/2の仕組み

HTTP/1.1 (Head-of-Line Blocking):
Connection 1: Request A ──────────► Response A
Connection 2: Request B ──────────► Response B
Connection 3: Request C ──────────► Response C
(Multiple connections, sequential per connection)

HTTP/2 (Multiplexing):
Single Connection:
├── Stream 1: Request A ──► Response A
├── Stream 2: Request B ──► Response B
├── Stream 3: Request C ──► Response C
└── All interleaved on same connection

主な機能

バイナリフレーミング層

HTTP/2 Frame Structure:
┌─────────────────────────────────────┐
│ Length (24 bits)                    │
├─────────────────────────────────────┤
│ Type (8 bits) │ Flags (8 bits)      │
├─────────────────────────────────────┤
│ Stream Identifier (32 bits)         │
├─────────────────────────────────────┤
│ Frame Payload (variable)            │
└─────────────────────────────────────┘

HPACKヘッダー圧縮

ストリームの優先順位付け

Priority Tree:
Root (connection)
├── CSS (weight: 256, high priority)
├── JavaScript (weight: 220)
└── Images (weight: 110, lower priority)

サーバー要件

対応バージョンを確認して利用します。各サーバーの対応状況と必要な機能を表で確認できます。

パフォーマンス上の利点

• 遅延の低減: 単一接続によりTCPハンドシェイクのオーバーヘッドをなくす
• 圧縮の改善: 反復リクエストでヘッダーサイズを85～90%削減する
• 並列読み込み: すべてのリソースを同時に読み込む
• サーバープッシュ: ブラウザーが要求する前にリソースを先に送る

ベストプラクティス

1. TLSを有効にする: HTTP/2は実質的にHTTPSを必要とし、ブラウザーもそれを強制する

2. ドメインシャーディングを減らす: 複数ドメインの利用は現在、性能を損なう

3. ファイル結合をやめる: 多重化によりバンドルの必要性が下がる

4. サーバープッシュを慎重に使う: 重要なリソースだけをプッシュする

5. 性能を監視する: 自分の用途でHTTP/2が改善したか検証する

HTTP/2はネットワーク接続をより効率的に使うことで、多くのウェブサイトの性能を大きく向上させます。