0Pricing
React Academy · Lesson

Optimistic Updates & Cache Invalidation

Update the UI instantly on mutation and invalidate cached data with tags.

Welcome

In this lesson you will build mutation endpoints in RTK Query, update the UI instantly with optimistic updates, and invalidate stale cache entries using tags.

Mutation Endpoints

Define mutations with builder.mutation(). Mutations modify server data (POST, PUT, DELETE) and return a useMutation hook.
export const userApi = createApi({
  /* ... */
  endpoints: (builder) => ({
    updateUser: builder.mutation({
      query: ({ id, ...body }) => ({
        url: '/users/' + id,
        method: 'PUT',
        body,
      }),
    }),
  }),
});

All lessons in this course

  1. Redux Toolkit Slices & createSlice
  2. Async Logic with createAsyncThunk
  3. RTK Query: Endpoints & Auto-Caching
  4. Optimistic Updates & Cache Invalidation
← Back to React Academy