Memoization Interview Questions

React.memo skips re-rendering a component when props are shallowly equal to the previous render. Inline objects and function props silently defeat it — pair with useMemo and useCallback on the parent side. Profile first; memo adds comparison overhead and should be applied surgically.

React re-renders a component when its state changes, its props change, or its parent re-renders. The third trigger cascades through entire subtrees by default. Reconciliation limits DOM mutations. Memoization prevents component function calls. Profile before optimizing.

useCallback memoizes a function reference so child components wrapped in React.memo skip re-rendering when the parent re-renders. Without React.memo on the child, useCallback adds overhead with no benefit. The dependency array must include every value the callback closes over.

useMemo caches a computed value; useCallback caches a function reference. useCallback(fn, deps) is equivalent to useMemo(() => fn, deps). useCallback without React.memo on the child adds overhead with no benefit. Both require an accurate dependency array to avoid stale closures.