Reactのパフォーマンス改善

どんな時にパフォーマンスが悪化する

• 大量のコンポーネントのリスト表示
• 複雑なコンポーネントのリスト表示

Reactのレンダリングのタイミング（トリガー）

1. コンポーネントの初回レンダー
2. コンポーネント(またはその祖先)のstate更新

レンダーとコミット – React

同計測する？

React DevTools の Profiler を使用する

どう最適化する？

1. React.memo

2. Virtualized rendering

API が優秀で、取り扱いしやすいのがおすすめ

Getting Started with React Virtuoso | React Virtuoso

3. useCallback

4. useMemo