Hummbitv1.x

Быстрый старт

Установка

yarn add hummbit

или

npm install hummbit

Первый store instance

import { initStore } from "hummbit";

const counterStore = initStore({
  initialState: { count: 0 },
  actions: {
    increment: (state) => ({ count: state.count + 1 }),
    decrement: (state) => ({ count: state.count - 1 }),
  },
  selectors: {
    count: (state) => state.count,
    isPositive: (state) => state.count > 0,
  },
});

Это самый короткий вариант: actions — это объект функций, которые получают текущий state snapshot и возвращают следующий фрагмент состояния (patch). Удобно для синхронных "pure" экшенов.

Ниже тот же пример, но через actionCreator (явное имя экшена + доступ к setState для async/нескольких последовательных обновлений):

Экшены через actionCreator

import { initStore } from "hummbit";

const counterStore = initStore({
  initialState: { count: 0 },
  actions: ({ actionCreator, setState }) => ({
    increment: actionCreator("increment", () =>
      setState((s) => ({ ...s, count: s.count + 1 })),
    ),
    decrement: actionCreator("decrement", () =>
      setState((s) => ({ ...s, count: s.count - 1 })),
    ),
  }),
  selectors: {
    count: (state) => state.count,
    isPositive: (state) => state.count > 0,
  },
});

Когда выбирать что

  • Используйте updater-форму (actions: { ... }), если обновление синхронное и его можно описать как state -> patch.
  • Используйте actionCreator, если нужен async flow, сайд-эффекты, последовательность нескольких setState, или вы хотите иметь явное имя экшена для DevTools/логов.

Actions, selectors и snapshot состояния

// Одноразовый snapshot текущего state
const before = counterStore.getState();

// Action изменяет state через встроенную очередь обновлений
await counterStore.actions.increment();

// Selector читает производные данные из актуального snapshot
const value = counterStore.selectors.count();
const positive = counterStore.selectors.isPositive();

const after = counterStore.getState();

Коротко:

  • Actions — изменяют состояние.
  • Selectors — читают (и вычисляют) данные из состояния без мутаций.
  • getState — моментальный read-only снимок текущего состояния.
Автор: Alexey TolkachevLinkedIn