CODEWITHSUNDEEP
reactjsreact-hooks
pingeyeg
pingeyeg

Reputation: 680

Why use Context API if it doesn't persist?

This is more for curiosity, but what's the point of using the Context API if it doesn't persist the data upon refresh? I get that we can use localStorage to fix the persistance, but then why not just use localStorage instead? With Redux, you still have the same problem so you use middleware to get around that. I'm sure I'm missing something here, but I've been dealing with Context lately and it drives me nuts when it's gone on refresh during development.

Upvotes: 2

Views: 796

Answers (1)

Adam Biggs
Adam Biggs

Reputation: 50

One of the best and most overlooked alternatives to Redux is React's own built-in Context API.

Context API provides a different approach to tackling the data flow problem between React’s deeply nested components. Context has been around with React for quite a while, but it has changed significantly since its inception. Up to version 16.3, it was a way to handle the state data outside the React component tree. It was an experimental feature not recommended for most use cases.

Initially, the problem with legacy context was that updates to values that were passed down with context could be “blocked” if a component skipped rendering through the shouldComponentUpdate lifecycle method. Since many components relied on shouldComponentUpdate for performance optimizations, the legacy context was useless for passing down plain data.

The new version of Context API is a dependency injection mechanism that allows passing data through the component tree without having to pass props down manually at every level.

The most important thing here is that, unlike Redux, Context API is not a state management system. Instead, it’s a dependency injection mechanism where you manage a state in a React component. We get a state management system when using it with useContext and useReducer hooks.

A great next step to learning more is to read this article by Andy Fernandez, which dives into the differences between Context API and Redux: Context API vs Redux: Managing Data Flow Through Nested Components in React

Upvotes: 2

Related Questions