Что такое Optimistic UI

Optimistic UI — это подход, при котором интерфейс мгновенно обновляется, предполагая успешное выполнение действия, до получения подтверждения от сервера. Если запрос завершится ошибкой, UI откатывает изменения.

Плюсы:

• Улучшает воспринимаемую скорость работы приложения.
• Пользователь видит результат действий без задержки.

Минусы:

• Требует обработки ошибок и отката изменений.
• Может вызвать рассинхронизацию, если сервер вернет неожиданные данные.

Пример:

function handleLike() {
  const oldLikes = post.likes;
  setPost({ ...post, likes: oldLikes + 1 }); // Оптимистичное обновление
  
  fetch('/like', { method: 'POST' })
    .catch(() => {
      setPost({ ...post, likes: oldLikes }); // Откат при ошибке
    });
}

Используется в соцсетях, формах, интерактивных элементах.