Паттерн SSOT (Single Source of Truth)
↑ 5.2 Состояние: Pinia, SSOT, Vue Query · ← Предыдущая · → Следующая
Зачем это на собесе
Принцип, защищающий от рассинхронизации данных между компонентами и стором.
Объяснение
SSOT: каждый факт данных имеет один авторитетный источник; остальное — производное или ссылка.
Практика во фронтенде:
| Правило | Пример |
|---|---|
| Один владелец состояния | список заказов принадлежит запросу/стору, а не копируется в компоненты |
Производное — через computed | total, filtered, isValid не хранятся как отдельные ref |
| Идентификаторы вместо копий | стор хранит selectedId, объект берётся из списка |
| Нормализация | byId: Record<id, Entity> и ids: id[]; связи по id |
| URL как источник для навигационного состояния | фильтры, страница, вкладка |
| Сервер — источник для серверных данных | клиентский кэш управляется Query |
| Изменения через единые точки (actions/mutations) | предсказуемая трассировка |
// Плохо: копия выбранного объекта рассинхронизируется при обновлении списка
const selected = ref<Order | null>(null);
// Хорошо
const selectedId = ref<number | null>(null);
const selected = computed(() => orders.value.find(o => o.id === selectedId.value) ?? null);Формы: значения редактирования — локальный черновик (draft), оригинал не мутируется до «Сохранить».
Нормализация:
const state = { ids: [1, 2], entities: { 1: { id: 1, customerId: 10 }, 2: { id: 2, customerId: 11 } } };Дублирование допустимо как осознанный кэш (денормализация для скорости) с чёткими правилами инвалидации.
Нюансы и подводные камни
- Копирование объектов в локальный стейт «на время» приводит к устаревшим данным.
- Хранение вычисляемых значений в state требует ручной синхронизации.
- Два стора, владеющих одним фактом, — источник конфликтов.
- Оптимистичные обновления временно нарушают SSOT: нужен откат (см. TanStack Vue Query: мутации и optimistic updates).
Практика
- Найдите в проекте дублирующиеся данные и оставьте один источник.
- Замените
selectedобъект наselectedId + computed. - Нормализуйте список сущностей со связями.
Вопросы с ответами
Что такое SSOT?
Принцип: у каждого факта данных один источник истины, остальные представления вычисляются из него.
Как избежать рассинхронизации выбранного объекта?
Хранить идентификатор и вычислять объект через
computed.