Considere el ejemplo:
const Child = () => { console.log("I did re-render!"); return null; }; const App = () => { const [_, setValue] = useState(); const fn = useCallback(() => { // do something }, []); return ( <div> <button onClick={() => setValue(Math.random)}>click</button> <Child fn={fn} /> </div> ); }; Con cada cambio de estado en la App (haga clic en el botón), el componente useCallback se vuelve a renderizar, incluso si el prop fn pasado se envuelve con Child . Sin embargo, si envuelvo Child con React.memo , comienza a funcionar correctamente; no se vuelve a procesar cuando el padre se vuelve a procesar.
Mi pregunta: ¿Cuál es el punto de usar useCallbacks sin React.memo ? ¿Debería usar siempre React.memo si no quiero que el componente se vuelva a renderizar siempre si su padre se vuelve a renderizar?
¿Debería useCallbacks siempre con React.memo ? Porque parece que no tienen sentido ni sirven sin React.memo .