Aprendiendo React, 2ª Edición

Capítulo 7. Mejorar los componentes con ganchos

Este trabajo se ha traducido utilizando IA. Agradecemos tus opiniones y comentarios: [e-mail]

La renderización es el latido de una aplicación React. Cuando algo cambia (props, estado), el árbol de componentes se renderiza, reflejando los datos más recientes como interfaz de usuario. Hasta ahora, useState ha sido nuestro caballo de batalla para describir cómo deben renderizarse nuestros componentes. Pero podemos hacer más. Hay más Ganchos que definen reglas sobre por qué y cuándo debe producirse la renderización. Hay más Ganchos que mejoran el rendimiento de la renderización. Siempre hay más ganchos para ayudarnos.

En el último capítulo, presentamos useState, useRef, y useContext, y vimos que podíamos componer estos Ganchos en nuestros propios Ganchos personalizados: useInput y useColors. Pero hay más. React viene con más Ganchos de fábrica. En este capítulo, vamos a echar un vistazo más de cerca a useEffect, useLayoutEffect, y useReducer. Todos ellos son vitales a la hora de crear aplicaciones. También veremos useCallback y useMemo, que pueden ayudar a optimizar el rendimiento de nuestros componentes.

Presentación de useEffect

En ya sabemos qué ocurre cuando representamos un componente. Un componente es simplemente una función que renderiza una interfaz de usuario. La renderización se produce cuando la aplicación se carga por primera vez y cuando cambian los valores de las utilidades y del estado. Pero, ¿qué ...