What is React.memo?

Why Interviewers Ask This

Foundational questions like this help interviewers calibrate the rest of the interview. A confident, accurate answer signals that you have solid React.js basics — a prerequisite for any developer role.

Answer

React.memo is a higher-order component that memoizes a function component, preventing re-renders when its props have not changed. Wrap a component: const MemoizedChild = React.memo(ChildComponent);. Now if the parent re-renders but passes the same props (by shallow comparison), MemoizedChild does not re-render. Shallow comparison: React.memo compares props with Object.is() for primitives (correct) but for objects and arrays, it compares references — if a parent creates a new object literal each render, memo does nothing because it is a new reference. Fix: use useMemo or useCallback to stabilize object/function props. Custom comparison: pass a comparison function as the second argument: React.memo(Component, (prevProps, nextProps) => prevProps.id === nextProps.id). When to use: components that render often with the same props (list items, icons, static UI sections). When to skip: components that almost always receive different props, components that are cheap to render, or components near the top of the tree.

Pro Tip

If you're unsure about a detail, say so honestly and explain your reasoning. Interviewers respect candidates who can think through uncertainty rather than bluffing.