5 hands-on exercises and 5 find-the-bug challenges for the Memoisation in React lesson. Every one is checked automatically in the browser — write the code, run it, and the tests tell you what still fails.
Use useMemo to compute the total once.
The memo should follow the multiplier.
Compute the filtered list with useMemo.
Wrap the handler in useCallback and use it.
Wrap the child in React.memo; it should still update when its prop changes.
The memo never recomputes because its dependency is not listed.
useMemo takes a function and stores what it returns.
Ready to write the code?
The editor, the automatic checks and the worked solutions open up with an account.
Open the workspaceThe predicate lets every number through.
The callback captured the first count and never updates.
A comparator returning true always says the props are equal, so the child freezes.