Framework Usage
How to connect @ilokesto/store to React, Vue, Svelte, and Angular.
Framework Usage
@ilokesto/store ships no official framework bindings. The three-method public API —
getState(), setState(next), and subscribe(listener) — is designed to be wrapped by a
thin adapter in any framework.
Adapter model
Every adapter follows the same five-step flow:
- Read the current snapshot with
store.getState(). - Mirror it into the framework's reactive model (ref, signal, readable, ...).
- Subscribe with
store.subscribe(listener). - On each notification, pull the new snapshot and push it into the reactive model.
- When the owning scope ends, call the returned unsubscribe function.
The vanilla store stays the source of truth. The adapter only translates snapshots into
the framework's update model and routes writes back through store.setState.
Caveats
- Snapshot consistency — read via
getState()inside the subscription callback, not from the listener argument. React must useuseSyncExternalStorefor tearing-free reads. - Cleanup — every adapter must call unsubscribe when its owning scope ends. Missing cleanup causes the store to hold a stale reference and fire the listener forever.
- No mutation —
Readonly<T>is a TypeScript hint only. The store does not freeze or deep-clone state at runtime. Treat snapshots as immutable values. - Synchronous notifications — the store notifies listeners synchronously after
setStatecompletes. There is no batching, debouncing, or render-layer scheduling.