About valtio
A skill for using Valtio, a proxy-based state library for React and vanilla JavaScript. It covers reactive state, React snapshots, subscriptions, utilities, and practices for organizing and persisting state.
Key features
- 01Proxy-based reactive state
- 02Render-optimized React snapshots
- 03State change subscriptions
- 04Observable Map and Set utilities
- 05Async state with Suspense
- 06State organization and persistence
Use cases
- 01Building reactive React component state
- 02Subscribing to changes outside components
- 03Managing observable Map or Set data
- 04Persisting and composing application state
Install
Copy the command and run it in a terminal.
$
npx skills add https:/After installing, type/valtioin Claude Code to confirm it loaded.
Bundled files
References and scripts installed along with SKILL.md.
GENERATION.mdreferences/best-practices-actions.mdbest-practices-persistence.mdbest-practices-state-composition.mdcore-proxy.mdcore-snapshot.mdcore-subscribe.mdcore-use-snapshot.mdguides-async.mdguides-component-state.mdguides-computed-properties.mdutils-devtools.mdutils-proxy-map.mdutils-proxy-set.mdutils-ref.mdutils-subscribe-key.mdDetails
From the project READMEValtio makes proxy-state simple for React and vanilla JavaScript. It provides a minimal, flexible, and unopinionated API that turns objects into self-aware proxies, enabling fine-grained subscription and reactivity. Valtio shines at render optimization in React and is compatible with Suspense and React 18+.
The skill is based on Valtio v2.3.0, generated at 2026-01-29.
Core References
| Topic | Description | Reference |
|---|---|---|
| Proxy | Create reactive state objects that track changes | core-proxy |
| useSnapshot | React hook for render-optimized state access | core-use-snapshot |
| Snapshot | Create immutable snapshots for comparison and Suspense | core-snapshot |
| Subscribe | Subscribe to state changes from anywhere | core-subscribe |
Utils
| Topic | Description | Reference |
|---|---|---|
| proxyMap | Observable Map-like proxy for Map data structures | utils-proxy-map |
| proxySet | Observable Set-like proxy for Set data structures | utils-proxy-set |
| subscribeKey | Subscribe to changes of a specific property | utils-subscribe-key |
| DevTools | Redux DevTools Extension integration | utils-devtools |
| Ref | Create unproxied references for special objects | utils-ref |
Guides
| Topic | Description | Reference |
|---|---|---|
| Component State | Isolate component state using useRef | guides-component-state |
| Computed Properties | Create computed properties with getters and setters | guides-computed-properties |
| Async | Work with promises and React Suspense | guides-async |
Best Practices
| Topic | Description | Reference |
|---|---|---|
| Actions | Organize actions for mutating state | best-practices-actions |
| Persistence | Persist state to localStorage or other storage | best-practices-persistence |
| State Composition | Split and compose states for organization | best-practices-state-composition |
Comments
Markdown supported