Q1. What is the useMemo hook?
useMemo is a React hook that memoizes the result of a computation. It takes a function and a dependency array, and returns the memoized value. The function runs only when a dependency changes, preventing expensive recalculations on every render.
Q2. When should you use useMemo?
Use it for expensive calculations that you don't want to re-run on every render. For example, filtering a large array, complex data transformations, or creating objects that cause child re-renders due to reference changes.
Q3. How is useMemo different from useCallback?
useMemo memoizes a value, while useCallback memoizes a function. useMemo returns the result of the function, useCallback returns the function itself. Both accept a dependency array.
Q4. What happens if you omit the dependency array?
If omitted, useMemo will compute a new value on every render, which defeats its purpose. If the array is empty, the value is computed once and never updates.
Q5. Can useMemo cause performance issues?
If used unnecessarily, useMemo adds overhead. Use it only when the computation is truly expensive. Premature optimization can harm readability and performance.