Este artículo explica de forma didáctica qué son los hooks useMemo y useCallback de React, para qué sirven y cuándo merece la pena utilizarlos. Ambos son herramientas de optimización del proceso de re-renderizado, que es el mecanismo con el que React mantiene la interfaz sincronizada con el estado de la aplicación.
El texto parte de una idea central: useMemo permite 'recordar' un valor calculado entre renders, de modo que no se recalcula si sus dependencias no han cambiado. El artículo lo ilustra con un ejemplo práctico: una aplicación que calcula todos los números primos entre 0 y un valor elegido por el usuario. Cuando se añade un reloj digital que actualiza un estado cada segundo, el recálculo constante de primados acaba saturando el hilo principal de JavaScript, provocando lentitud. Ahí es donde useMemo evita trabajo innecesario: solo repite el cálculo costoso cuando la dependencia (el número seleccionado) cambia.
Además, se introduce el concepto de 'snapshot' o instantánea de render, comparable al DOM virtual, y se mencionan las dos estrategias que ofrecen estos hooks: reducir el trabajo dentro de un render y reducir el número de renders de un componente. El enfoque es accesible para desarrolladores que ya conocen React básico y buscan profundizar en el modelo mental correcto para aplicar estas optimizaciones sin abusar de ellas.