PickPrompt
一覧に戻る
CLIClaude

Claude Code でフロントエンドパフォーマンスを一括改善

Lighthouse指標を基準に、Core Web Vitals・バンドルサイズ・レンダリングを最適化

このプロジェクトのフロントエンドパフォーマンスを最適化してください。 【最適化対象】 1. Core Web Vitals - LCP(Largest Contentful Paint)→ 画像最適化、フォント読み込み - CLS(Cumulative Layout Shift)→ レイアウトシフト防止 - INP(Interaction to Next Paint)→ インタラクション応答速度 2. バンドルサイズ - 不要な依存パッケージの特定と削除 - 動的importによるコード分割 - Tree shakingの確認 3. レンダリング最適化 - 不要なre-renderの検出と修正 - React.memo / useMemo / useCallback の適切な使用 - Server Components と Client Components の分離 【現在の問題(あれば)】 {{例: 初回読み込みが3秒以上、画像が重い、など}} 各改善のbefore/after(推定値)を一覧で出力してください。
#パフォーマンス#最適化#ClaudeCode
シェア:Xでシェア