intermediate

Selectors

Подписывайтесь на минимальные фрагменты store, чтобы компоненты перерисовывались только при используемых данных.

Компоненты Zustand подписываются через hook store с селектором: `useStore((s) => s.bears)`. Ре-рендер только при изменении выбранной части (по умолчанию shallow при селекторе).

					const bears = useStore((s) => s.bears);
const addBear = useStore((s) => s.addBear); // стабильно, если ссылка на action стабильна
				

Для нескольких полей — shallow compare из `zustand/shallow` или два вызова селектора. Не выбирайте весь store, если компоненту не нужно всё.

Компромисс: точечные подписки против селекторов, пересоздаваемых на каждом рендере без стабилизации.

На интервью: сравнение с Redux useSelector и ре-рендерами Context.

Типовые ошибки: inline object selector `(s) => ({ a: s.a, b: s.b })` без shallow, новые массивы на каждый select, подписка вне React без `subscribe`.

Чеклист:

  • Минимальная проекция при выборе.
  • shallow для object/tuple.
  • Разделяйте селекторы состояния и actions.
  • useStore.subscribe для слушателей вне React.