Hook · Sincronización
useEffect
Sincronizar con el exterior
useEffect no es 'código que corre después de render'. Es la forma de decirle a React: cuando este componente esté en pantalla, mantén algo del mundo exterior en sintonía con su estado.
El bucle setup → cleanup
Cada vez que las dependencias cambian, React corre el cleanup del efecto anterior y luego el setup del nuevo. Por eso devolver una función de limpieza importa: es lo que cancela suscripciones, timers o requests obsoletas.
Las dependencias
El array [] declara qué valores reactivos usa el efecto. Omitir uno provoca cierres viejos; añadir cosas que no usas dispara renders innecesarios. Trata el linter como un compañero estricto pero correcto.
Tropiezos comunes
- 01Si tu efecto solo reacciona a un evento (click, submit), no debería ser un efecto — ponlo en el handler.
- 02useEffect en StrictMode corre dos veces en dev: es a propósito, para que detectes cleanups mal escritos.
- 03Un fetch sin AbortController genera carreras: la respuesta vieja puede sobrescribir la nueva.
¿Fue útil?
Inicia sesión para dar feedback