performance-profiling
Lighthouse で Web パフォーマンスをプロファイリング
このスキルは、Lighthouse 監査とブラウザ開発者ツールを使用して、Web アプリケーションのパフォーマンスを測定・最適化するためのものです。ボトルネックを特定し、Core Web Vitals スコアを改善するための構造化されたワークフローを提供します。
下载技能 ZIP
在 Claude 中上传
前往 设置 → 功能 → 技能 → 上传技能
开启并开始使用
测试它
正在使用“performance-profiling”。 Web サイトで Lighthouse 監査を実行する
预期结果:
パフォーマンススコア:78/100
主な調査結果:
- LCP:2.8 秒(改善が必要)
- CLS:0.05(良好)
- INP:180ms(良好)
推奨事項:
1. レンダリングブロックリソースを排除する
2. 画像の適切なサイズ設定
3. JavaScript 実行時間を短縮する
正在使用“performance-profiling”。 Core Web Vitals の閾値は何か?
预期结果:
Core Web Vitals 閾値:
| メトリクス | 良好 | 不良 |
|-------|------|------|
| LCP | < 2.5 秒 | > 4.0 秒 |
| INP | < 200ms | > 500ms |
| CLS | < 0.1 | > 0.25 |
安全审计
安全Evaluated 11 static security findings. All patterns detected are false positives. The subprocess.run call uses list arguments (not shell=True), preventing command injection. Temp file operations use the safe tempfile module. Documentation examples in SKILL.md are not executable code. The 'cryptographic algorithm' alerts were misidentified keywords. This is a legitimate performance profiling skill with no security concerns.
高风险问题 (2)
中风险问题 (2)
低风险问题 (1)
质量评分
你能构建什么
ロード速度を最適化するフロントエンド開発者
フロントエンド開発者が Web アプリの読み込みパフォーマンスを改善したい場合。このスキルを使用して Lighthouse 監査を実行し、主要なパフォーマンスボトルネックを特定して、ターゲットを絞った最適化を適用します。
CI パフォーマンスチェックを設定する DevOps エンジニア
DevOps エンジニアが CI/CD パイプラインに自動パフォーマンステストを追加したい場合。このスキルの Lighthouse スクリプトを使用して、各デプロイで監査を実行し、パフォーマンス閾値を下回るビルドを失敗させます。
ランタイムの問題をトラブルシュートするフルスタック開発者
フルスタック開発者が Web アプリで遅いインタラクションに気づいた場合。このスキルを使用してランタイムパフォーマンスをプロファイリングし、長時間タスクを特定し、DevTools の Memory タブでメモリリークを見つけます。
试试这些提示
performance-profiling スキルを使用して、https://example.com で Lighthouse パフォーマンス監査を実行してください。パフォーマンススコアと主な推奨事項を示してください。
performance-profiling スキルを使用して、Core Web Vitals(LCP、INP、CLS)が何を測定するものかを説明し、各メトリクスを改善するためのヒントを提供してください。
performance-profiling スキルを適用して、大規模な JavaScript バンドルを分析してください。どのような一般的な問題を探す必要があり、推奨される最適化アクションは何ですか?
performance-profiling スキルの 4 ステップのプロファイリングワークフロー(BASELINE、IDENTIFY、FIX、VALIDATE)を使用して、遅い Web アプリケーションの最適化を支援してください。ベースラインの確立から始めてください。
最佳实践
- 変更を加える前に、必ずパフォーマンスベースラインを確立する
- マイクロ最適化ではなく、最大のボトルネックから優先的に対処する
- 変動を考慮して、繰り返し測定により改善を検証する
避免
- プロファイリングなしでパフォーマンス問題を推測する
- 実際のボトルネックを特定する前にコードを最適化する
- 合成テストのみを優先し、実際のユーザーデータを無視する