Not using useCallback is premature optimization
Following this articles advice will likely make your app render slower than not optimizing at all. Caching everything increases your risk of stale data through misconfiguration.  Also the benefits of referential stability only apply to a limited set of components in your overall render tree.<p>Most data structures and components don&#x27;t need stability. The issue people have with hooks is primarily caused by 99% of folks not quite understanding just how sparingly hooks should be used.<p>You should only worry about referential equality once you&#x27;ve profiled a performance issue from some high frequency interaction. This is the only time to useCallback, useMemo, or any form of referential caching.<p>An element walks into a bar. If your component accepts children or any react elements as props, quite normal, all optimizations around referential equality for its inputs will be flung out the window as that component de-optimizes at every optimization prematurely added.<p>Another big mistake I see folks of all levels make often is expecting more program design upfront vs. say just managing configurations.<p>- &lt;Example&gt;&lt;Test &#x2F;&gt;&lt;&#x2F;Example&gt;<p>- &lt;Example onTest={() =&gt; {}} &#x2F;&gt;<p>- &lt;Example test={{}} &#x2F;&gt;<p>- &lt;Example tests={[]} &#x2F;&gt;<p>These all have the same render cost, so there is often no reason to extract function handlers&#x2F;arrays&#x2F;objects out of the jsx configuration.