redux-toolkit VS jotai

Redux Toolkit offers a robust and predictable framework that scales well with large applications.

Redux Toolkit Official Docs

8. Redux & Redux Toolkit – State Management Simplified 🧠

Redux is a predictable state management tool for JavaScript apps. A state is something that keeps the app running for example when you are asked to select gender in a website, the state is either male or female.

I said the wrong shape, because I think that, if redux-toolkit was the version people used a lot in the past, their views on redux would be different today. Being more positive, than it is.

So you can imagine how much more we'd need to write to introduce reducers and actions in a real-world application. This is where Redux ToolKit comes in very handy.

Redux Toolkit Documentation

Redux is rather overkill in today's front end ecosystem if you're building an MVP, and as of late more have been using redux-toolkit or useReducer to update slices of state.4

React 19 Async Features Boa v0.20 Rust-Powered Engine Safari 18.2 Developer Updates Redux Toolkit 2.5 Termo Civet Rockpack

RTK Query: A data-fetching and state management tool for making API requests to our backend.

If we want to use React 19, one of the best options is to use Waku. It's a lightweight framework made by the author of Jotai.

Jotai is a lightweight and flexible solution that fits naturally into the React paradigm.

TanStack Query Zustand Jotai Context API

You don't need Redux or Jotai right away.

Jotai State Management

Note that this kind of reactivity isn't exclusive to the "PUSH-PULL" model. Fine-grained reactivity refers to the precise tracking of system dependencies. So, there are PUSH and PULL reactivity models which also work in this way (I'm thinking about Jotai or Recoil.

Atomic state management solutions, like Recoil or Jotai, break down state into small, reusable units called atoms. It's reducing unnecessary re-renders by allowing components to subscribe only to the specific pieces of state they need. When a state update occurs, only the components that depend on that particular atom will re-render, rather than triggering a re-render of the entire component tree or large sections of it. It's so easy and comfortable to user, I remember the first time I used it I thought to myself "Wow! that's the way it should be done!" basically if you understood react's useState hook you'll understand how to use these libraries.

MailList is found to be using a state management tool named Jotai.

Since I am building shadcn-ui/ui from scratch and also documenting how to do so alongside, I am aware that it will take quite some time to understand the code and write it from scratch and prepare the content. I am not rushing the process by directly copying and pasting, instead I am trying to understand the concepts, code, patterns and strategies that can be applied in other projects. This is how I picked up that “mail” example in shadcn-ui/ui uses Jotai for state management.