Slate Errors

Informational (1xx)

103

Early Hints

— 先行ヒント

まずは確認: よくある原因 TOP3

  1. 表示高速化のための preload ヒント先送り
    本体の HTML を作る間に、CSS/フォントなどを並行で取りに行かせる
  2. CDN/エッジでの先回り通知
    オリジンの応答前にエッジが 103 を返してブラウザを動かす
  3. HTTP/2 Server Push の代替
    Push の廃止後、103 がリソースヒントの主流に

これは何のサイン?

103 は「最終的な答えはまだ準備中だけど、先にこのリソースを取りにいっておくと早く済むよ」と教えてくれる先回りのヒントです。 校庭で例えると、コーチが朝の集合時に「次の体育ではボールとビブスを使うから、準備室から出しておいてね」と先に教えてくれる——あの段取りのよさに似ています。

サーバーは 103 で Link ヘッダを送り、ブラウザは本体 HTML を待たずに CSS やフォントの取得を始められます。実装が広がってきた比較的新しいサインで、ページ表示の高速化に効きます。

校庭からのひとこと

校庭での朝礼では、その日の予定を先に伝えてくれると、生徒は次の動きの準備ができます。「次は体育館に移動して、跳び箱を出しておく必要があるよ」と言ってもらえれば、空き時間に器具を運ぶ生徒が出てきて、本番がスムーズになります。

103 はちょうどそれと同じ役割です。本体の応答 (200) はあとから来ますが、その前に「先に取りに行ってよさそうなもの」だけを教えてくれる。並行して動くことで、ページが見える時間が早まります。

受け止め方

次にあなたができること:

  1. Link ヘッダのヒントに従って先取り取得:preload 指定のリソースを並列で取り始める
  2. ブラウザ対応を確認:ChromiumやFirefoxの新しめのバージョンが対応、古いと無視されるだけで害はない
  3. サーバー側で対応する LP を選ぶ:効果が大きいページから少しずつ 103 を返す
  4. CDN/エッジでの中継設定を確認 (管理者向け):上流が 103 を投げても、中間機器が落としてしまうと意味がなくなる

実際にはこう見える

$ リクエスト

curl -i https://example.com/some/path

↓ レスポンス

HTTP/1.1 103 Early Hints
Content-Type: text/html; charset=utf-8

<!DOCTYPE html>
<html><body><h1>103 Early Hints</h1></body></html>

似ているケース

もっと知りたい