TECH_COMPARISON

Valtio vs Jotai: Proxy-Based Mutation vs Atomic Immutability

Valtio uses JavaScript Proxy for intuitive mutable state; Jotai composes immutable atoms for fine-grained reactive subscriptions.

6 min readUpdated Jan 15, 2025
valtiojotaistate-managementreactproxy

Overview

Valtio and Jotai are both lightweight React state management libraries created by Daishi Kato. They represent two different philosophical approaches to solving the same problem. Valtio uses JavaScript's Proxy API to make state objects reactive — you mutate state directly as you would a regular JavaScript object, and Valtio detects and propagates those changes. Jotai takes an immutable, atomic approach — state is composed of small atoms, and updates produce new values rather than mutating existing objects.

Both are small (~3KB), have minimal API surfaces, and integrate naturally with React hooks. The choice between them is largely a matter of mental model preference and specific async state requirements.

Key Technical Differences

Valtio's core primitive is proxy(initialState), which returns a reactive state object. You can mutate it directly: state.count++, state.user.name = 'Alice'. Valtio's Proxy tracks which properties are accessed and triggers re-renders only in components that read those specific properties. The useSnapshot hook returns an immutable snapshot of the proxy state for safe reading in React components — direct proxy mutation in render functions is not recommended.

Jotai's atoms are the smallest unit of state. An atom holds a single value and can be read and written with useAtom. Derived atoms are created by passing a read function that accesses other atoms — Jotai handles the dependency tracking automatically. Async atoms whose read function returns a Promise integrate with React Suspense, enabling clean async data access without manual loading state.

Valtio's derive utility creates computed state derived from proxy objects, but it is a secondary API compared to Jotai's first-class derived atom support. For applications with significant amounts of derived state, Jotai's model is cleaner.

Performance & Scale

Both libraries achieve fine-grained re-rendering: components only re-render when the specific state they access changes. Valtio's Proxy-based tracking and Jotai's atom subscriptions both achieve this goal through different mechanisms. Performance at runtime is comparable; the choice between them should not be made on performance grounds.

When to Choose Each

Choose Valtio when you prefer a mutable, imperative state model — if you find writing state.count++ more intuitive than setCount(count + 1). Valtio also works naturally outside React without a hook layer, making it suitable for shared state between React and non-React code.

Choose Jotai when you prefer an atomic, immutable model, need Suspense-integrated async atoms, or have complex derived state relationships. Jotai's first-class derivation and async support make it the more powerful choice for data-heavy applications.

Bottom Line

Valtio and Jotai are both excellent from the same author. Valtio wins for teams that prefer imperative mutation style and non-React access. Jotai wins for teams that prefer atomic composition and async Suspense integration. Either is a strong choice over heavier alternatives for lightweight state needs.

GO DEEPER

Master this topic in our 12-week cohort

Our Advanced System Design cohort covers this and 11 other deep-dive topics with live sessions, assignments, and expert feedback.