Time to First Byte(TTFB)バジェットと最適化
Time to First Byteバジェットの設定と追跡。TTFBが他のすべてのパフォーマンスメトリクスに与える影響と、CDN、キャッシング、エッジコンピューティングによるサーバーレスポンス時間の削減戦略。
Timing Metrics
詳細な説明
TTFBパフォーマンスバジェット
Time to First Byte(TTFB)は、ブラウザがリクエストを送信してからレスポンスの最初のバイトを受信するまでの時間を測定します。基盤メトリクスです — 他のすべてのタイミングメトリクス(FCP、LCP、TTI)は遅いTTFBによって遅延します。
TTFBしきい値
| 評価 | TTFB |
|---|---|
| 良好 | < 800 ms |
| OK | < 1800 ms |
| 不良 | > 1800 ms |
バジェット推奨
| アーキテクチャ | TTFB目標 |
|---|---|
| 静的サイト(CDN) | < 100 ms |
| SSG + CDN | < 200 ms |
| SSR + CDN | < 400 ms |
| SSR(CDNなし) | < 600 ms |
| 動的(API) | < 800 ms |
TTFBの構成要素
TTFB = DNSルックアップ + TCP接続 + TLSハンドシェイク + サーバー処理 + ネットワーク遅延
最適化戦略
- CDN — ユーザーに近いエッジロケーションから配信
- HTTP/2またはHTTP/3 — 接続の再利用で後続リクエストのオーバーヘッドを削減
- サーバーサイドキャッシュ — データベースクエリ、レンダリングHTML、APIレスポンスをキャッシュ
- エッジコンピューティング — CDNエッジノードでサーバーロジックを実行
- データベース最適化 — インデックスクエリ、コネクションプーリング、リードレプリカ
- プリコネクト — サードパーティオリジンに
<link rel="preconnect">を使用
ユースケース
TTFBバジェットは、サーバーレンダリングアプリケーションや動的コンテンツを持つサイトにとって重要です。2秒のTTFBを持つEコマースサイトは、2.5秒のLCPを達成することは不可能です — リソース読み込みとレンダリングに500 msしか残りません。TTFBバジェットを設定することで、フロントエンド最適化と並んでサーバーサイドパフォーマンスへの投資を促します。