Словарь основных понятий

Event

Event (событие, эвент) это функция, на вызовы которой можно подписаться. Она может обозначать намерение изменить состояния в приложении, указанием на то, что происходит в приложении, быть командой для управления сущностями, триггером вычислений и так далее.

Event в документации

Store

Store (состояние, стор) это объект который хранит состояние. В приложении могут совместно существовать множество состояний

Store в документации

Effect

Effect это контейнер для сайд-эффектов, возможно асинхронных. В комплекте имеет ряд заранее созданных эвентов и сторов, облегчающих стандартные действия

При императивном вызове всегда возвращает Promise с результатом.

Может иметь один аргумент или не иметь ни одного

Effect в документации

Domain

Domain это способ группировки и применения массовых обработок к юнитам. Домены получают уведомления о создании событий, сторов, эффектов и вложенных доменов. Часто используются для логгирования и SSR

Domain в документации

Unit

Тип данных, используемый для описания бизнес-логики приложений. Большинство методов эффектора имеют дело с обработкой юнитов. Существует пять типов юнитов: store, event, effect, domain и scope

Common unit

Обычные юниты можно использовать для запуска обновлений других юнитов. Существует три типа обычных юнитов: store (стор), event (событие) и effect (эффект). Когда метод принимает юниты, это означает, что он принимает события, эффекты и сторы в качестве источника реактивных обновлений

Purity

Большинство функций, передаваемых в методы api не должны вызывать другие события или эффекты: легче рассуждать о потоке данных приложения, когда императивные триггеры сгруппированы внутри обработчиков эффектов, а не рассредоточены по всей бизнес-логике

Правильно, императивно:

import {createStore, createEvent} from 'effector'

const login = createStore('guest')

const loginSize = login.map((login) => login.length)

const submitLoginSize = createEvent()

loginSize.watch((size) => {
  submitLoginSize(size)
})

Запустить пример

store.map в документации

store.watch в документации

Правильно, декларативно:

import {createStore, createEvent, forward} from 'effector'

const login = createStore('guest')

const loginSize = login.map((login) => login.length)

const submitLoginSize = createEvent()

forward({
  from: loginSize,
  to: submitLoginSize,
})

Запустить пример

forward in docs

Не правильно:

import {createStore, createEvent, forward} from 'effector'

const submitLoginSize = createEvent()

const login = createStore('guest')
const loginSize = login.map((login) => {
  // лучше переместить этот вызов в watch или эффект
  submitLoginSize(login.length)
  return login.length
})

Reducer

type StoreReducer<State, E> = (state: State, payload: E) => State | void
type EventOrEffectReducer<T, E> = (state: T, payload: E) => T

Reducer вычисляет новое состояние, учитывая предыдущее состояние и данные из события. Для сторов, если reducer возвращает undefined или то же состояние (===), то обновления не будет

Watcher

type Watcher<T> = (update: T) => any

Watcher - функция с сайд-эффектами, для работы которых не нужны возможности по перехвату ошибок и уведомления подписчиков об завершении асинхронной работы. Используется в event.watch, store.watch и хуках домена. Возвращаемое значение игнорируется

Subscription

type Subscription = {
  (): void
  unsubscribe(): void
}

Функция отмены подписки, после её вызова watcher перестаёт получать обновления и удаляется из памяти. Повторные вызовы функции отмены подписки не делают ничего

Ручное управление подписками мешает сосредоточиться на управлении данными и бизнес-логикой

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