react-vite

StateLoom React + Vite Example

A React 19 + TypeScript + Vite application demonstrating all four StateLoom paradigms with React hooks.

What's Demonstrated

Counter (useSignal + Computed + Batch)

• useSignal() to subscribe to a core signal and computed
• batch() for coalescing multiple signal updates into one render

Todo List (useStore + Logger + Persist)

• useStore() to subscribe to store state with full destructuring
• logger middleware for console state change logging
• persist middleware with memoryStorage for persistence

User Profile (useAtom + Derived)

• useAtom() for read-write access to atoms
• useSignal() with a derived atom for computed display
• Two-way binding between inputs and atoms

Settings (useSnapshot + Observable Proxy)

• useSnapshot() to subscribe to an observable proxy
• Direct property mutation triggers re-renders
• Frozen snapshot prevents accidental mutation in render

Running

pnpm install
pnpm dev

Building

pnpm build
pnpm preview