Valtio Proxy State

Mutate state directly with Valtio's proxy-based store. Reads track automatically, snapshots are immutable, and React re-renders only the components that actually used changed fields.

This skill builds Valtio stores with proxy(), derive(), subscribe(), and proxyMap/proxySet. Patterns include nested state mutation, useSnapshot for fine-grained reads, devtools integration, and bridging Valtio with Jotai or Zustand when needed.

When to use

Use when you want Mobx-style direct mutation but with Valtio's smaller surface, or when porting from useState soup to a centralized store without refactoring every setter.

Examples

Shopping cart store

Direct mutation on a nested cart with fine-grained re-renders

Build a Valtio cart store with items, totals, and discounts — mutate items directly, derive totals, and useSnapshot at the line-item level

Real-time collab presence

Track per-user presence with proxyMap

Use Valtio proxyMap to track per-user cursor positions in a collaborative whiteboard, subscribed via WebSocket