Should every async call response be stored in the redux store?

Question

Whats the recommended pattern to make async calls in react-redux. I know that each of my component can independently call the API and store data in its local state but then what's the use of redux store? Just to store data that is shared between components? What is the downside of storing all the responses in the redux store and vice-versa. Thanks!

Answer 1

Yeah pretty much. Don't dispatch network calls to your redux store if you only need it in one component. Or otherwise you'll end up connecting a lot of your components to the store and it will drag down the performance of your application.

Answer 2

A redux store is for maintaining a global state that can be consumed by your components.

General rule of thumb is if your data is not used by multiple components or only used in the FLUX pattern you can maintain the state in a specific container component. It's a lot of boilerplate to set up a redux action so always think about the trade off and if you really need to do all of the extra work.

Read up on the Container/Presentational by Dan Abramov here: https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0

Edit: Dan Abramov is no longer a proponent of the container presentational architecture.