ysmood / stalo

An elegant state management solution for React.
https://stalo-examples.vercel.app
MIT License
6 stars 0 forks source link

Compared with zustand #1

Open ysmood opened 2 months ago

ysmood commented 2 months ago

Here's the example code of zustand from link:

import { create } from 'zustand'
import { immer } from 'zustand/middleware/immer'

type State = {
  count: number
}

type Actions = {
  increment: (qty: number) => void
  decrement: (qty: number) => void
}

export const useCountStore = create<State & Actions>()(
  immer((set) => ({
    count: 0,
    increment: (qty: number) =>
      set((state) => {
        state.count += qty
      }),
    decrement: (qty: number) =>
      set((state) => {
        state.count -= qty
      }),
  })),
)

Same logic and type safety in stalo:

import { create } from "stalo/lib/immer"

export const [useStore, setStore] = create({
  count: 1,
})

export const increment = (n: number) => setStore((s) => { s.count += n })
export const decrement = (n: number) => setStore((s) => { s.count -= n })
ysmood commented 4 weeks ago

Zustand doesn't have native devtools support:

https://youtu.be/DpQg0EDeTEc