valtio

Original：🇺🇸 English

Translated

Valtio proxy state management for React and vanilla JavaScript. Use when creating reactive state, managing application state, or working with proxy-based state management.

6installs

Sourcehairyf/skills

Added on2026-02-04

NPX Install

npx skill4agent add hairyf/skills valtio

SKILL.md Content

View Translation Comparison →

Valtio 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