Перейти к основному содержимому

State Management

State management — это управление состоянием приложения во время его выполнения.

Состояние — это данные, которые:

  • меняются во времени
  • влияют на UI
  • участвуют в логике

Примеры:

  • состояние форм
  • загруженные данные
  • текущие шаги пользовательских сценариев

Как думать​

Важно не просто хранить данные, а понимать:

  • где должно жить состояние
  • кто и как его изменяет
  • как UI реагирует на изменения
  • что стоит хранить, а что лучше вычислять
  • как не смешивать UI, бизнес-логику и данные с сервера в одну кучу

Виды состояния​

Локальное состояние​

Живёт внутри одного виджета или небольшого участка UI.

Примеры:

  • открыт ли dropdown
  • выбран ли tab
  • состояние чекбокса
  • локальный текстовый input

Состояние фичи​

Отвечает за логику одной части приложения.

Примеры:

  • авторизация
  • чат
  • каталог
  • фильтры и список данных

Глобальное состояние​

Используется во всём приложении.

Примеры:

  • текущий пользователь
  • тема
  • язык
  • настройки приложения

Отдельные виды состояния​

Некоторые сценарии полезно рассматривать отдельно:

  • данные с сервера
  • формы
  • навигация

Практика​

Базовый уровень​

  • Форма с валидацией
    Реализовать форму с вводом данных, проверкой значений и отображением ошибок

  • Список с загрузкой данных
    Реализовать экран со списком данных с состояниями loading / empty / error

  • Фильтры
    Реализовать фильтры для списка (например по категории или статусу) с обновлением UI

Продвинутый уровень​

  • Аутентификация
    Реализовать регистрацию, вход, восстановление пароля и управление состоянием пользователя

  • Многошаговая форма
    Сделать форму с несколькими шагами, асинхронной валидацией и зависимыми полями

  • Чат
    Реализовать список сообщений с пагинацией, сохранением позиции и обновлением при новых сообщениях

Вопросы для размышления​

  • Как ты обычно понимаешь, что состояние “стало слишком большим” или неудобным?
  • В каких ситуациях тебе проще оставить всё локально, даже если можно вынести выше?
  • Когда фильтры начинают “расползаться” по приложению — как ты решаешь, где им жить?
  • Были ли ситуации, когда изменение состояния приводило к неожиданному поведению UI? Как ты это отлавливал?
  • Когда работа с серверными данными начинает усложняться, что ты меняешь в подходе?
  • Как ты обычно упрощаешь state, если он стал запутанным?