React Hooks para optimizar el rendimiento
Guía de uso de los hooks useMemo y useCallback para incrementar el rendimiento de nuestras aplicaciones
English version: https://medium.com/@ger86/react-hooks-to-optimize-performance-2bb876b25d67
Cuando desarrollamos aplicaciones con React llega un momento en el que toca preocuparse acerca del rendimiento de la misma (cuanto antes mejor 😛). En general, en cuanto comenzamos a trabajar en el desarrollo de aplicaciones de tamaño medio, la optimización y el rendimiento suelen ser uno de los principales quebraderos de cabeza.
En este artículo y aprovechando la consolidación de los React Hooks quiero presentar un par de soluciones que pueden ayudar a evitar los dos problemas típicos que provocan un bajo rendimiento en las aplicaciones:
- Re-renders innecesarios.
- Cálculo computacional pesado en los componentes repetidas veces.
Gracias a los hooks useCallback
y useMemo
dispondremos de dos herramientas sencillas con las que prevenir algunos de los casos que provocan dichos problemas.
¡Vamos a verlos!