Find Similar Packages for nanostores

Package	Downloads	Stars	Size	Issues	Publish	License

nanostores	115,926	5,605	43.6 kB	24	4 months ago	MIT

nanostores

Nano Stores

A tiny state manager for React, React Native, Preact, Vue, Svelte, Solid, Lit, Angular, and vanilla JS. It uses many atomic stores and direct manipulation.

Small. Between 265 and 814 bytes (minified and brotlied). Zero dependencies. It uses Size Limit to control size.
Fast. With small atomic and derived stores, you do not need to call the selector function for all components on every store change.
Tree Shakable. A chunk contains only stores used by components in the chunk.
Designed to move logic from components to stores.
Good TypeScript support.

// store/users.ts
import { atom } from 'nanostores'

export const $users = atom<User[]>([])

export function addUser(user: User) {
  $users.set([...$users.get(), user]);
}

// store/admins.ts
import { computed } from 'nanostores'
import { $users } from './users.js'

export const $admins = computed($users, users => users.filter(i => i.isAdmin))

// components/admins.tsx
import { useStore } from '@nanostores/react'
import { $admins } from '../stores/admins.js'

export const Admins = () => {
  const admins = useStore($admins)
  return (
    <ul>
      {admins.map(user => <UserItem user={user} />)}
    </ul>
  )
}

Made at Evil Martians, product consulting for developer tools.

Docs

Read full docs here.