When should we choose to optimise with useMemo?
Optimising with useMemo is only valuable in a few cases:
The calculation you’re putting in useMemo is noticeably slow, and its dependencies rarely change.
We pass the result of a function as a prop to a component wrapped in memo. We want to skip re-rendering if the value hasn’t changed. Memoization lets your component re-render only when dependencies aren’t the same.
The value you’re passing is later used as a dependency of some Hook. For example, maybe another useMemo calculation value depends on it. Or maybe useEffect depends on it