Skip to content
UX Atlas
PatternCraft conventionAdvanced

Optimistic UI

Apply the change immediately and reconcile with the server afterwards, so the interface never waits on the network.

Definition

Optimistic UI updates local state as soon as the user acts, assuming success, then reconciles when the server responds. If the operation fails, the change is reverted visibly and the reason explained.

Craft convention. True because the industry converged on it. Breaking it costs familiarity, not correctness.

On this page
  1. Definition
  2. When it is appropriate
  3. In practice
  4. Continue from here

When it is appropriate

  • The operation almost always succeeds.
  • Failure is recoverable and the revert is easy to understand.
  • The user can tolerate a brief inconsistency.
  • Good candidates: likes, toggles, reordering, adding a tag, marking as read.
  • Bad candidates: payments, irreversible deletions, anything where the user will act on the assumed result before it is confirmed.

In practice

Optimistic reordering

Task tools

Drag-and-drop reordering that waits for a server round trip feels broken. Applying the move immediately and reconciling in the background is the only acceptable behaviour for direct manipulation.

Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.

Applies when you are designing

Principles behind this

The reasoning this solution is an application of.

Often used with

These usually appear in the same screen or the same decision.

Alternative approach

A different answer to the same problem, with a different cost.

  • Loading StatesPattern

    Optimistic UI removes the wait instead of decorating it, and pays for it in rollback complexity.

Practical example

A worked decision where this was the deciding factor.

Short definition

The one-paragraph version, for when that is all you need.