Introduction

Welcome to the Jotai documentation! Jotai is a primitive and flexible state management library for React.

It takes a bottom-up approach to global React state management with an atomic model inspired by Recoil. One can build state by combining atoms and renders are optimized based on atom dependency. This solves the extra re-render issue of React context and eliminates the need for memoization.

Features

• Minimal API
• TypeScript oriented
• Tiny core bundle size (2kb)
• Many extra utilities and integrations
• Supports Next.js, Gatsby, Remix, and React Native
• Great developer experience with React Fast Refresh

Core

Jotai has a very minimal API, exposing only a few exports from the main jotai bundle. They are split into four categories below.

Utilities

Jotai also includes a jotai/utils bundle with a variety of extra utility functions. One example is atomWithStorage, which includes localStorage persistence and browser tab synchronization.

Integrations

Jotai has separate bundles for many official integrations including atomWithQuery for React Query and atomWithMachine for XState, among many others.

Tools

There are also SWC and Babel compiler plugins for React Fast Refresh support and debugging labels to provide the best developer experience when using Jotai in a React framework such as Next.js or Gatsby.

Basics

Learn the basic concepts and primitives of the library, discover how it compares with other solutions, and see examples of it in use.

Guides

These guides can help with use common cases such as TypeScript, React frameworks, and basic patterns.

Recipes

These recipes can help with more advanced patterns.