Announcing Jotai v1

We are pleased to announce jotai v1 release!
Jotai is a primitive and flexible state management library for React.

Demos:

• Text Length example
• Hacker News example
• Todos example

Global state like useState

Jotai's atoms can be used like useState, but it's global state.

const yearAtom = atom(2021)

const Component = () => {
  const [year, setYear] = useAtom(yearAtom)
  return <>{year} <button onClick={() => setYear((c) => c + 1)}>Next</button></>
}

Derived state

You can create a derived atom with read function.

const meterAtom = atom(1000)
const kilometerAtom = atom((get) => get(meterAtom) / 1000)

Minimal API and additional utilities

Jotai core jotai exposes only two functions atom, useAtom and one optional component Provider.

We have more functions in separate bundles jotai/*, such as jotai/utils and jotai/devtools.
For example, those include atomWithStorage, atomWithReset, atomFamily, to name a few.
They are all implemented with the public api of jotai core.
So, you can also create a similar third-party library.

Async support

Jotai comes with Suspense support. If your read function is async, it will suspend behind the scenes, and you wouldn't need to care async state in your code.

const idAtom = atom('id001')
const dataAtom = atom(async (get) => {
  const response = await fetch(`.../${id}`)
  return response.json()
}

const Component = () => {
  const [data] = useAtom(dataAtom)
  return <>{data.title} - {data.author}</>
}

Notes about Suspense

We use the undocumented behavior of "Suspense for Lazy Loading" for any async.
"Suspense for Data Fetching" is still to be finalized.
Hence, this feature is technically unstable. We try our best to keep the API when it migrates.

Integrations

Jotai comes with various integrations. Some of them are complete, some are preliminary.

• jotai/immer: immer integration
• jotai/optics: optics-ts integration
• jotai/query: react-query integration
• jotai/xstate: xstate integration
• jotai/valtio: valtio integration
• jotai/zustand: zustand integration
• jotai/redux: redux integration

Moving forward

The core API should be stable for React 16.8 and above.
All major issues are resolved, and if there is a bug by chance, we will fix it as soon as possible.

We will be adding more utility functions on top of core, and your use cases would be important. Free free to open a new discussion.

We are already working on new integrations for urql and rxjs. We have a plan to work on dedicated integration for nextjs.

When React releases a new version with Suspense and Concurrent support, we will start working on the next major version. Our hope is to keep the API compatible.

Notes about Versioning

We follow semantic versioning for core jotai.
Note that type-only changes and sub bundles jotai/* don't strictly follow the semver.
Please check release notes for details.