Question 1

React.memoの主な役割は何ですか？

Accepted Answer

React.memoは、コンポーネントのレンダリング結果をメモ化するHigher-Order Componentです。propsの浅い比較を行い、propsが変更されていない場合は再レンダリングをスキップします。同じpropsを頻繁に受け取るコストの高い子コンポーネントの最適化に特に有用です。

Question 2

useMemoとuseCallbackの主な違いは何ですか？

Accepted Answer

useMemoは関数の結果（返り値）をメモ化し、useCallbackは関数そのものをメモ化します。useMemoはコストの高い計算を最適化するために使用され、useCallbackはpropsとして渡される関数の参照を安定させ、メモ化された子コンポーネントの不要な再レンダリングを防ぐために使用されます。

Question 3

React.memoの使用が逆効果になるのはどのような場合ですか？

Accepted Answer

React.memoは、毎回異なるpropsを受け取るコンポーネントでは逆効果になり得ます。propsの浅い比較のコストが利点なく追加されるためです（コンポーネントはどのみち再レンダリングされます）。React.memoは、同じpropsを頻繁に受け取り、レンダリングコストの高いコンポーネントに使用するのが適切です。

React パフォーマンス最適化

React.memoの主な役割は何ですか？

回答

useMemoとuseCallbackの主な違いは何ですか？

回答

React.memoの使用が逆効果になるのはどのような場合ですか？

回答

React.memoでメモ化されたコンポーネントにpropとして渡す関数にuseCallbackを使用するのはなぜですか？

React.lazyを使ったcode splittingの主な利点は何ですか？

その他のReact / Next.js面接トピック

JavaScript の基礎

React の基礎

React Hooks

コンポーネントのライフサイクル

React Router

Contextを使った状態管理

フォームと Controlled Components

データ取得と API

React Query (TanStack Query)

Styling & CSS-in-JS

Next.jsの基礎

TypeScriptとReact

Next.js データフェッチング

Next.js Server Actions

Next.jsのルーティングとナビゲーション

Next.js API Routes

Next.js Metadata & SEO

Next.js の Middleware と Auth

React テスト

Zustand State Management

Error Boundaries & エラーハンドリング

Advanced React Patterns

Next.jsの高度な機能

Next.jsのデプロイメントと本番環境

アーキテクチャ & デザインパターン

React Server Components

Next.js の国際化

React セキュリティ & ベストプラクティス

次の面接に向けてReact / Next.jsをマスター