Skills / Engineering / Nanostores

Nanostores

Tiny (334 bytes) framework-agnostic state for React, Vue, Svelte, Solid, Preact, and Astro islands. Atoms, maps, and computed stores that share state across multiple frameworks on the same page.

This skill wires Nanostores into Astro islands, multi-framework apps, and tiny widgets where Zustand or Jotai are overkill. Covers atom, map, computed, persistent (localStorage), router, and i18n stores with first-class TypeScript.

nanostores state-management astro tiny

When to use

Use in Astro projects with multiple framework islands sharing state, in size-sensitive widgets and embeds, or as a Redux replacement when you want sub-1kb global state.

Examples

Astro island cart

Share cart state between React and Svelte islands on the same page

Build a Nanostores cart that's hydrated in a React island header and a Svelte island sidebar on an Astro page

Persistent user prefs

Sync theme and locale to localStorage

Create persistent Nanostores for theme and locale that survive reload and broadcast via the storage event across tabs
Added to wishlist