When should we choose to optimise with useMemo?

Difficulty: 5/10

performance optimization, memoization, react hooks

Optimising with useMemo is only valuable in a few cases:

1
The calculation you’re putting in useMemo is noticeably slow, and its dependencies rarely change.
2
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.
3
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

0-2 years experience

2-5 years experience

Difficulty: 5/10

performance optimization, memoization, react hooks

Optimising with useMemo is only valuable in a few cases:

1
The calculation you’re putting in useMemo is noticeably slow, and its dependencies rarely change.
2
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.
3
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

0-2 years experience

2-5 years experience