Серверное и клиентское состояние

Серверное состояние удалённое, асинхронное, общее и в конечном счёте согласованное: списки, детали, права из API. Клиентское — синхронное и принадлежит UI: выбранная вкладка, открытая модалка, черновик формы до submit, optimistic overlay.

| Измерение | Серверное | Клиентское | |-----------|-----------|------------| | Источник истины | Backend | UI в браузере | | Устаревание | Ожидаемо | Не применимо | | Инструменты | TanStack Query, SWR, RTK Query | useState, Zustand, Redux | | Инвалидация | Ключи, теги, refetch | Локальный setState |

Не зеркальте весь ответ API в Redux, если кэш-библиотека уже управляет свежестью, дедупликацией и фоновым refetch. Клиентское состояние — для того, чего сервер ещё не знает.

Компромисс: меньше библиотек против когнитивной нагрузки — две категории состояния означают две модели инвалидации, но смешение в одном store скрывает баги.

На интервью: почему список продуктов в query cache, а «кликнутая колонка сортировки» остаётся локальной.

Типовые ошибки: Redux как ручной fetch cache, дублирование серверных данных в двух местах, loading/error как постоянная форма store вместо метаданных запроса.

Чеклист:

• Истина на сервере остаётся на сервере.
• Кэш-библиотеки владеют свежестью удалённых данных.
• Клиентский store — только для UI-координации.
• Записи синхронизируйте через mutations и инвалидацию.