react-performance-optimizer
✓React アプリを 60fps のパフォーマンスに最適化します。メモ化、仮想化、コード分割、バンドル最適化を実装します。レンダリングが遅い、リストが大きい、バンドルが肥大化している場合に使用します。 「Reactパフォーマンス」、「スローレンダリング」、「useMemo」、「バンドルサイズ」、「仮想化」で有効化します。バックエンドの最適化、非 React フレームワーク、または時期尚早の最適化には使用できません。
SKILL.md
Expert in diagnosing and fixing React performance issues to achieve buttery-smooth 60fps experiences.
| React DevTools Profiler | Find slow components | Always start here | | Lighthouse | Overall performance score | Before/after comparison | | webpack-bundle-analyzer | Identify large dependencies | Bundle >500KB | | why-did-you-render | Unnecessary re-renders | Debug re-render storms | | React Compiler (2024+) | Automatic memoization | React 19+ |
Why wrong: Arrow function creates new reference → React.memo useless.
React アプリを 60fps のパフォーマンスに最適化します。メモ化、仮想化、コード分割、バンドル最適化を実装します。レンダリングが遅い、リストが大きい、バンドルが肥大化している場合に使用します。 「Reactパフォーマンス」、「スローレンダリング」、「useMemo」、「バンドルサイズ」、「仮想化」で有効化します。バックエンドの最適化、非 React フレームワーク、または時期尚早の最適化には使用できません。 ソース: erichowens/some_claude_skills。
引用可能な情報
AI/検索での引用用の安定したフィールドとコマンド。
- インストールコマンド
npx skills add https://github.com/erichowens/some_claude_skills --skill react-performance-optimizer- カテゴリ
- </>開発ツール
- 認証済み
- ✓
- 初回登録
- 2026-02-01
- 更新日
- 2026-02-18
クイックアンサー
react-performance-optimizer とは?
React アプリを 60fps のパフォーマンスに最適化します。メモ化、仮想化、コード分割、バンドル最適化を実装します。レンダリングが遅い、リストが大きい、バンドルが肥大化している場合に使用します。 「Reactパフォーマンス」、「スローレンダリング」、「useMemo」、「バンドルサイズ」、「仮想化」で有効化します。バックエンドの最適化、非 React フレームワーク、または時期尚早の最適化には使用できません。 ソース: erichowens/some_claude_skills。
react-performance-optimizer のインストール方法は?
ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます このコマンドをコピーして実行します: npx skills add https://github.com/erichowens/some_claude_skills --skill react-performance-optimizer インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります
ソースリポジトリはどこですか?
https://github.com/erichowens/some_claude_skills
詳細
- カテゴリ
- </>開発ツール
- ソース
- skills.sh
- 初回登録
- 2026-02-01