What is optimistic UI and how can you build it?
Model answer
Optimistic UI updates the screen immediately as if the server request will succeed, then fixes it if it fails. For example, a like button turns on at once. With TanStack Query you update the cache in onMutate and roll back in onError. React 19 offers useOptimistic for the same idea.
Always handle the failure case so users see the true state.
Learn this topic
TanStack Query (React Query): Fetching, Caching and Updating Server Data in the course React.js Full Course: Beginner to Advanced.
Sign in to add your own answer.
More questions
- How do you show loading and error states when fetching data?
- What does TanStack Query (React Query) give you over useEffect and fetch?
- What is the difference between server state and client state?
- When do you need Redux, Zustand or another state library?
- What is Redux Toolkit and why is it recommended over plain Redux?
- How do you handle authentication tokens in a React app securely?