@nano_kit/store

A lightweight state management library inspired by Nano Stores and built around a push-pull based reactivity system.

• Tiny. ~2 kB (minified & brotlied). Zero dependencies.
• Fast. Optimized for performance using the push-pull algorithm.
• Tree-Shakeable. Only the methods you import end up in your bundle.
• TypeScript. First-class type support out of the box.

Installation

pnpm add @nano_kit/store
# or
npm install @nano_kit/store
# or
yarn add @nano_kit/store

Quick Start

Here is a minimal example demonstrating signals, computed values, and effects in action:

import { signal, onMount, computed, effect } from '@nano_kit/store'

/* Create independent atomic stores */
const $count = signal(1)

/* Mountable: Run logic only when store has listeners */
onMount($count, () => {
  console.log('Mounted: Store is active')
  /* e.g., open websocket, start timer, etc. */

  return () => {
    console.log('Unmounted: Store is idle')
    /* e.g., close websocket, stop timer */
  }
})

/* Derive state (computed values are lazy & cached) */
const $double = computed(() => $count() * 2)

/* React to changes (triggers onMount) */
const unsub = effect(() => {
  console.log(`Count: ${$count()}, Double: ${$double()}`)
})
// Output: Count: 1, Double: 2

/* Update triggers granular propagation */
$count(2)
// Output: Count: 2, Double: 4

/* Cleanup: removes listener and triggers onMount destructor */
unsub()
// Output: Unmounted: Store is idle

Documentation

For comprehensive guides, advanced patterns, and API reference, visit the documentation website.