Mid-Level Performance 6 min read

useMemo vs useCallback — React Performance Hooks Explained

The Interview Question

What is the difference between useMemo and useCallback? When should you actually use them?

Expert Answer

useMemo memoizes a computed value. useCallback memoizes a function reference. That's the core distinction. useMemo runs a function and caches its return value, only recomputing when dependencies change. useCallback caches the function itself so it maintains the same reference between renders. The critical insight that separates good answers from great ones: neither of these should be your default. They add complexity and memory overhead. You should reach for them when you have a measurable performance problem — typically when passing callbacks to memoized child components (useCallback) or when you have genuinely expensive computations (useMemo).

Key Points to Hit in Your Answer

  • useMemo caches the result of calling a function; useCallback caches the function itself
  • useCallback(fn, deps) is equivalent to useMemo(() => fn, deps)
  • Don't use them by default — they're optimizations, not best practices
  • useCallback matters when passing callbacks to React.memo'd children
  • useMemo matters for expensive calculations (sorting large arrays, complex math)

Code Example

// useMemo — cache an expensive computation
const sortedItems = useMemo(() => {
  return items.sort((a, b) => a.price - b.price);
}, [items]);

// useCallback — cache a function reference
const handleClick = useCallback((id) => {
  setSelected(id);
}, []);

// Why useCallback matters with React.memo:
const ExpensiveChild = React.memo(({ onClick }) => {
  // Only re-renders if onClick reference changes
  return <button onClick={onClick}>Click</button>;
});

What Interviewers Are Really Looking For

The interviewer is testing whether you understand when optimization is warranted vs. premature. The best answer acknowledges that most components don't need these hooks, then gives a concrete example where they actually matter — like preventing re-renders of a virtualized list with thousands of rows.

Practice This Question with AI Grading

Reading about interview questions is a start — but practicing with real-time AI feedback is how you actually get better. Goliath Prep grades your answers instantly and tells you exactly what you're missing.

Start Practicing Free →