"Context vs Redux" has been one of the most widely debated topics within the React community ever since the current React Context API was released. Sadly, most of this "debate" stems from confusion over the purpose and use cases for these two tools. I've answered various questions about Context and Redux hundreds of times across the internet (including my posts Redux - Not Dead Yet!, React, Redux, and Context Behavior, A (Mostly) Complete Guide to React Rendering Behavior, and When (and when not) to Reach for Redux), yet the confusion continues to get worse.
Given the prevalence of questions on this topic, I'm putting together this post as a definitive answer to those questions. I'll try to clarify what Context and Redux actually are, how they're meant to be used, how they're different, and when you should use them.
Are Context and Redux the same thing?
No. They are different tools that do different things, and you use them for different purposes.
Is Context a "state management" tool?
No. Context is a form of Dependency Injection. It is a transport mechanism - it doesn't "manage" anything. Any "state management" is done by you and your own code, typically via
Are Context and
useReducer a replacement for Redux?
No. They have some similarities and overlap, but there are major differences in their capabilities.
When should I use Context?
Any time you have some value that you want to make accessible to a portion of your React component tree, without passing that value down as props through each level of components.
When should I use Context and
When you have moderately complex React component state management needs within a specific section of your application.
When should I use Redux instead?
Redux is most useful in cases when:
- You have larger amounts of application state that are needed in many places in the app
- The app state is updated frequently over time
- The logic to update that state may be complex
- The app has a medium or large-sized codebase, and might be worked on by many people
- You want to be able to understand when, why, and how the state in your application has updated, and visualize the changes to your state over time
- You need more powerful capabilities for managing side effects, persistence, and data serialization