What is the useMemo hook?

useMemo memoizes the result of a computation, recalculating it only when its dependencies change. Syntax: const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);. On subsequent renders, if a and b have not changed, React returns the cached result without re-running the function. When to use: (1) Expensive calculations (complex array transformations, sorting large lists, heavy math). (2) Referential stability — when you need the same object/array reference across renders to prevent child re-renders or satisfy useEffect dependencies: const options = useMemo(() => ({ limit: 100, filter }), [filter]);. When NOT to use: For simple computations (adding two numbers, string formatting) — the overhead of useMemo exceeds the computation cost. Common mistake: using useMemo for everything (premature optimization). Only memoize when there is a measurable performance problem. React may also discard the memoized value in the future (e.g., for memory pressure) — do not rely on it for correctness, only for performance.