Optimistic UI: Dos enfoques para aplicaciones React
Mike Codeur
¿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?