Retour aux articles
martes, 21 de enero de 202526 vues5

Optimistic UI: Dos enfoques para aplicaciones React

Mike Codeur

ESNext
Astuces
JavaScript
React

¿Tu aplicación se siente lenta? ⏳
¿Has considerado implementar un enfoque de Optimistic UI?

La idea es simple: Sé optimista.

No necesitas esperar la respuesta del servidor (y sufrir su latencia) para actualizar el estado de tu componente.

Aquí tienes algunos ejemplos concretos:

  • ¿Un usuario publica un comentario? Aparece instantáneamente en la lista.
  • ¿Añadir una nueva fila a tu tabla? Se muestra de inmediato.

¿La respuesta del servidor? ¡No importa! Asumimos que hay un 99,9 % de probabilidad de que funcione correctamente.
¿Y si hay un error? No hay problema, simplemente volvemos al estado anterior.

¿Cómo hacerlo?

  • Con TanStack Query, puedes implementar este enfoque de manera avanzada utilizando la gestión de caché local.
  • ¿Buscas algo más simple? Con React 19, el hook useOptimistic te permite lograr este comportamiento directamente.

🚀 Combinado con las Server Actions, es increíblemente poderoso. (Todo esto lo cubrimos en Next Mastery.)

¿Ya utilizas este enfoque para hacer que tus interfaces sean más reactivas? useoptimistic react 19

Abonnes-toi à la NewsLetter

Apprends les meilleures pratiques pour devenir un développeur web moderne (JavaScript / React / Next).

Gagner sa vie grâce au code
Devenir développeur Freelance
+35 000 développeurs déjà inscrits.

Accès instantané. Aucune carte de crédit requise.

Rejoins +35 000 développeurs déjà inscrits.