Redux vs. Recoil

Which is better?

You’ve likely heard of Redux. It’s a popular state management tool for JavaScript apps, including React sites. Its website says it’s predictable, centralized, debuggable, and flexible.

And it has some competition.

I’ve been hearing more about Recoil lately. Recoil is said to be easier to work with than Redux. But each one has its pros and cons.

Let’s take a brief look at them. But first, let’s define some of their terms.

Vocabulary

In Redux, the source of truth is in one store. In order for components to access the store, they need to be wrapped in Redux’s Provider component.

You need to define:

• Actions to describe the shape of data sent to the store.
• Reducers to receive and use actions to update the store.
• Selectors to read from the store.

Understanding all these definitions takes a while.

Recoil operates differently. The state is split up into small units called atoms. In order for components to access atoms, they need to be wrapped in a RecoilRoot component.

You do not need to define:

• Functions to update atoms.