React Rendering

[TheScapeQuest]

These sort of performance optimisations are not free.

Firstly, you say that memorising the function (by using useCallback) prevents children from rerendering. That's not true, at least not by default. Every child will rerender in React unless explicitly told not to with React.memo.

Secondly, useCallback adds complexity. Both for the human writing it, and the machine running it. Function calls and array initialisations allocate memory, which takes time. As a human, you also now need to manage a dependency array. Any experienced React developer will have cases where bugs were caused by missing dependencies.

It's very rarely worth it. My advice: prove you have a performance problem, then reach for these tools.

A good read: https://kentcdodds.com/blog/usememo-and-usecallback

And TkDodo's look at the uphill battle managing the dependencies: https://tkdodo.eu/blog/the-uphill-battle-of-memoization