Using Suspense with Redux

[barth12]

Hi guys,

My question is pretty simple but the answer can be complicated I guess.
Have you ever experimented with Suspense together with Redux. I mean, is it possible to wait with Suspense (showing Loader) until Redux will fetch data(with axios for example) and save it to the store? Or should we just wait for the future releases where combining Redux and Suspense will be simple? Meanwhile, is there a way to implement this scenario already?

[gaearon]

Using Suspense for any kind of data fetching is not supported yet. See our roadmap: https://reactjs.org/blog/2018/11/27/react-16-roadmap.html#react-16x-mid-2019-the-one-with-suspense-for-data-fetching

As for your specific question, we'll need to wait and see. I don't have a clear answer at this time.

[brianespinosa]

@gaearon Would now be a good time to reopen this issue to begin to discuss possible patterns for use of Suspense now that Concurrent mode is in an experimental release?

https://reactjs.org/docs/concurrent-mode-intro.html

[brneto]

@brianespinosa I totally agree with you. In my specific case I’ve added redux-saga to work with redux to deal with side effects like fetching data. I’m very interested to see how to use it with the new experimental React suspense component!

Please @gaearon, would you already have any thoughts about a pattern to work with suspense and redux-saga as well?

[brianespinosa]

For anyone looking here to see where this discussion is headed, it seems like the best place to continue the conversation is on the react-redux repository. Suspense specific discussion starts with this comment.

[abdoutech93]

I testing react 18 with redux 7 with connect. to improve my app performance I'm trying Suspense but I'm getting some runtime exceptions like : startTransition is not a function.
this is a test with redux and it's getting the same exception I mentioned : https://codesandbox.io/s/test-redux-in-concurrent-mode-with-react-redux-pytbh

[markerikson]

Answered @abdoutech93 's question over in the React-Redux repo. The issue is the sandbox was not updated to match the recent flipped order of return values from useTransition, and has nothing to do with Redux or React-Redux.