Fine-grained reactive state for React
Subscribe to an exact state path, components re-render only when that leaf changes. No selectors, no memoization.
npm install @yoltra/core @yoltra/reactThe libraries
Yoltra
0.10.0Fine-grained reactive state for TypeScript and React: event-sourced stores, atomic subscriptions and time-travel devtools.
Yoltra Design System
0.4.0The Yoltra Design System: accessible React components, design tokens and themes, rendered on the server.
See it react
Only this value re-renders, it subscribes to one state path.
const n = useAtomicProp("counter", (s) => s.n);
// only components reading counter.n re-renderLess boilerplate than selectors + memo
Others: selector + memo
// Redux Toolkit: selector + memoization
const title = useSelector(
(s) => s.items[id]?.title,
shallowEqual,
);
// re-renders whenever the selector's slice changesYoltra: atomic path
// Yoltra: subscribe to the exact path
const title = useAtomicProp(
"items",
(s) => s[id].title,
);
// re-renders only when that leaf changesWhy Yoltra
Atomic subscriptions
Subscribe to an exact path like items.0.title. Components re-render only when that leaf changes.
Event-sourced
Every change is an event. Replay, audit, and reason about state over time.
Time-travel devtools
Inspect the state tree, scrub the timeline, and jump to any point.
No selectors, no memo
Typed path accessors do the work, skip the selector and memoization boilerplate.
Ready to build?
Start with the Quick Start, or explore the full API reference.