use-inline-memo

use-inline-memo copied to clipboard

see https://ahooks.js.org/hooks/advanced/use-persist-fn

userPersistFn is very useful to replace useCallback. It would be greate to integrate such ability into this library

Checked it out, but couldn't really see why it exists. Then I discovered the link to https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback and read that. Now it made a bit more sense, but the React docs also state:

In either case, we don’t recommend this pattern and only show it here for completeness. Instead, it is preferable to avoid passing callbacks deep down.

So I am not yet convinced that this is something we should look into. I mean, they downright call it an anti-pattern in the React docs 😅

What exactly would we gain from that?

From my experience, usePersistFn could be used as drop-in replacement for the useCallback in many cases.

It is simpler, since we don't have to setup a long list of deps for the callback.

It is more performant since the child component will only receive the same function instance and could leverage memo's shallow compare easily.

Although react doesn't recommend it, it is not an anti-pattern, it's just an optimization mechanism for some cases, as we don't recommend using ref, it is indeed important.