Chris Anstey
Bojan Pavic
速度を最適化しているブランドは、多くの場合、すぐに回帰します。これは、ウェブサイトのパフォーマンスは健康づくりによく似ているためです。一度努力するだけでは不十分で、ライフスタイルを変える必要があります。
パフォーマンス バジェットは、これに対処するための 1 つの方法です。パフォーマンス バジェットとは、サイトのパフォーマンスに影響する指標に対する一連の制限です。この概念は財務の予算に似ています。つまり、限度額を設定し、その範囲内に収まるようにすることです。一般に、優れたパフォーマンス バジェットは、さまざまな種類の指標を組み合わせたものです。たとえば、商品ページのパフォーマンス バジェットは次のようになります。
| 低速の 3G で操作可能になるまでの時間 | 次より小さい | 5 秒 |
| 低速 3G での First Contentful Paint | 次より小さい | 2 秒 |
| Lighthouse のパフォーマンス スコア | 次より大きい | 80 |
| JavaScript の合計サイズ | 次より小さい | 170 KB |
設定したら、パフォーマンス バジェットを適用する必要があります。たとえば、その予算をビルドプロセスとレポートに組み込む必要があります。継続的インテグレーションに Lighthouse などのツールを含めると、主要な指標が設定されたしきい値を下回った場合にビルドが失敗するテストを作成できます。さらに、ダッシュボードや概要レポートによる定期的なレポートは、可視性とアカウンタビリティに役立ちます。Pinterest は、高速なエクスペリエンスを維持するためにパフォーマンス バジェットを実装している企業の一例です。また、Experian などのブランドは現在、月次エグゼクティブ KPI レポートの主要な指標としてサイトの速度を使用しています。
パフォーマンス バジェットについて詳しくは、こちらをご覧ください。パフォーマンス文化を浸透させ、すべての関係者にスピード指標を可視化して具体的なものにする方法については、こちらのガイドをご覧ください。