validating-performance-budgets

パフォーマンス予算バリデーター

事前に定義したパフォーマンス予算に照らして、ページの読み込み時間、バンドルサイズ、API の応答時間を検証し、本番環境に反映される前にリグレッションを検出します。

概要

このスキルを使うと、Claude が事前に定義した予算に照らしてアプリケーションのパフォーマンスを自動的に検証できます。パフォーマンスのリグレッションを特定し、アプリケーションが最適なパフォーマンス特性を維持できるようにします。

仕組み

1. パフォーマンス指標の分析：Claude がページの読み込み時間、バンドルサイズ、API の応答時間など、現在のパフォーマンス指標を分析します。
2. 予算との照合：プラグインがこれらの指標を、事前に定義したパフォーマンス予算のしきい値と照合します。
3. 違反の報告：指標が定義済みの予算を超えた場合、このスキルが違反を報告し、超過したしきい値の詳細を提示します。

このスキルを使うタイミング

以下が必要なときに、このスキルが有効になります。

• 事前に定義した予算に照らしてパフォーマンスを検証する。
• アプリケーションのパフォーマンスのリグレッションを特定する。
• パフォーマンス予算の検証を CI/CD パイプラインに組み込む。

例

例 1：パフォーマンスのリグレッションを防ぐ

ユーザーのリクエスト：「ホームページのパフォーマンス予算を検証してください。」

このスキルは次の処理を行います。

1. ホームページのパフォーマンス指標（読み込み時間、バンドルサイズ）を分析します。
2. これらの指標を定義済みの予算と比較します。
3. 読み込み時間の予算超過など、違反があれば報告します。

例 2：CI/CD との統合

ユーザーのリクエスト：「ビルドプロセスの一環として、パフォーマンス予算の検証を実行してください。」

このスキルは次の処理を行います。

1. パフォーマンス予算の検証コマンドを実行します。
2. 定義済みのすべてのパフォーマンス指標を、それぞれの予算と照合します。
3. ビルドを失敗させる違反があれば報告します。

ベストプラクティス

• 予算の定義：現在のアプリケーションのパフォーマンスとユーザーの期待に基づいて、現実的で達成可能なパフォーマンス予算を定義します。
• 指標の選定：ページの読み込み時間や API の応答時間など、ユーザーエクスペリエンスに直接影響する関連性の高いパフォーマンス指標を選びます。
• CI/CD との統合：パフォーマンス予算の検証を CI/CD パイプラインに組み込み、パフォーマンスのリグレッションを自動的に検出して防止します。

統合

このスキルは、ウェブサイト速度テストツールや API 監視サービスなど、パフォーマンス指標を提供する他のプラグインと統合できます。また、アラート用プラグインと併用して、パフォーマンス予算への違反を開発者に通知することもできます。

前提条件

• ${CLAUDE_SKILL_DIR}/performance-budgets.json にあるパフォーマンス予算の定義
• パフォーマンステストツール（Lighthouse、WebPageTest）へのアクセス
• バンドル分析用のビルド出力ディレクトリ
• 比較用の過去のパフォーマンス指標

手順

1. パフォーマンス予算の設定を読み込みます
2. 現在のパフォーマンス指標（読み込み時間、バンドルサイズ、API のレイテンシ）を収集します
3. 指標を定義済みの予算のしきい値と比較します
4. 予算への違反とその重大度を特定します
5. 詳細な違反レポートを作成します
6. 改善に向けた推奨事項を提示します

出力

• パフォーマンス予算の検証レポート
• 予算のしきい値を超えた指標の一覧
• 前回の測定結果との比較
• 指標カテゴリ別の詳細な内訳
• 修正に役立つ実行可能な推奨事項

エラー処理

予算の検証に失敗した場合：

• 予算設定ファイルが存在することを確認します
• パフォーマンステストツールが利用可能か確認します
• 指標収集に必要なアクセス権限を検証します
• テスト対象のエンドポイントへのネットワークアクセスを確認します
• 予算のしきい値の定義を見直します

リソース

• パフォーマンス予算のベストプラクティス
• Lighthouse のパフォーマンススコアリングガイド
• バンドルサイズの最適化手法
• パフォーマンステストの CI/CD 統合パターン