Retour aux articles
Tuesday, January 21, 202523 vues5

Optimistic UI: Two Approaches for React Applications

Mike Codeur

ESNext
Astuces
JavaScript
React

Is your app feeling slow? ⏳
Have you considered implementing an Optimistic UI approach?

The idea is simple: Be optimistic.

No need to wait for the server’s response (and suffer its latency) to update your component’s state.

Here are some concrete examples:

  • A user posts a comment? It appears instantly in the list.
  • Adding a new row to your table? It shows up immediately.

The server’s response? We don’t care! We assume there’s a 99.9% chance it’ll work correctly.
And if there’s an error? No worries, we simply roll back to the previous state.

How can you do this?

  • With TanStack Query, you can implement this approach in an advanced way using local cache management.
  • Looking for something simpler? With React 19, the useOptimistic hook allows you to achieve this behavior directly.

🚀 Combined with Server Actions, it’s incredibly powerful. (All of this is covered in Next Mastery.)

Do you already use this approach to make your interfaces more responsive? 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.