Skip to main content

Examples

Every example here is tiny and solves exactly one problem. No mega demo app, no boilerplate to wade through — each page shows a real use case in the fewest lines that still make the point. The full runnable sources live in src/examples/.

A note on imports: the snippets import from @priolo/jon. If you copy-pasted rvx_juice.ts instead, import from your local file — same API. Pages that need the full library (watchers, lifecycle hooks) say so explicitly.

The basics

  • Counter — the hello world: one store, one component.
  • Store instances — one setup, many stores: an array of window components, each with its own instance.
  • Async fetch — loading / data / error, the canonical async pattern.

Rendering, only when it matters

  • Conditional render — re-render a component only when its data changes.
  • Nested render — predicates + memo in a component hierarchy.
  • List rows — update one row of a list without touching the others.

Real-world jobs for a store

  • Router — client-side routing with params, no router library.
  • Persist — save and restore state from localStorage.
  • Mix stores — compose setups like classes: a generic "persistent" base + the real properties.
  • Validator form — declarative field validation.
  • Watch stores — two decoupled stores that react to each other.