v8.0.0-beta.0

[markerikson]

This beta release adds a new 'react-redux/compat' entry point for use with React 16.9+ 17.x, re-enabling broader compatibility across React versions to make it easier to upgrade to React-Redux v8.

While there are no other changes since the previous alphas (and there's really been very minimal feedback reported on the alphas thus far), we believe the v8 pre-releases are stable enough to begin seriously evaluating them as upgrades in your apps. This also aligns with React 18 being upgraded to beta status and the useSyncExternalStore API stabilizing.

We would really appreciate users trying out this release with all compatible versions of React and reporting the results, even if it's just "yup, tried it and it works"! See the linked discussion thread.

npm i react-redux@next

yarn add react-redux@ntext

Changelog

New "Compat" Entry point

In 8.0.0-alpha.0, we switched the internals of connect and useSelector to use the new useSyncEternalStore API from React. At the time, that was only available in the form of a "shim" package that worked with multiple React versions.

In 8.0.0-alpha.1, useSyncExternalStore had been added to React itself. The original plan was always to make React-Redux v8 have a hard dependency on React 18, and the shim adds about 750 bytes to bundle size, so we dropped use of the shim entirely.

After suggestions from the community, we've now added a new 'react-redux/compat' entry point that falls back to using the shim. This should enable React-Redux v8 to work correctly with earlier versions of React that support hooks (16.9+ and 17.x), as well as Preact (which does not appear to be implementing useSyncExternalStore at this time).

We've updated our test suite to run all tests against both React 18 and the standard entry point with no uSES shim, and React 17 and the "compat" entry point with the uSES shim, and all tests are passing.

The likely approach for using this would be to alias or override your build setup to redirect imports of 'react-redux' to the 'react-redux/compat' entry point instead.

What's Changed

• Add a "compat" entry point that works with React 16.9+ and 17 by @markerikson in Add a "compat" entry point that works with React 16.9+ and 17 #1842

v8.0.0-alpha.1...v8.0.0-beta.0

---

This discussion was created from the release v8.0.0-beta.0.

[JonCognioDigital]

Just a couple of quick questions. I want to use React Redux and Redux toolkit in a personal project of mine but I'm a little confused as to go about this with new versions coming out all the time and compatibility. I want to use the latest version of everything and I don't care that it might break because it's a personal project. So...

A) If I use React-Redux v8.0beta am I ok to use the latest version of react toolkit or do I need a newer beta version of that? Are they just totally separate products or do they rely on version matching?

B) I'm using React 18 beta too and I've read something about no longer requiring memoized selectors, so do I need to change the way I write selectors with v8 as redux-toolkit uses ReSelect?

Sorry for the dumb questions, I've only used react-toolkit in one simple project before.

[markerikson]

Redux Toolkit is completely separate from React-Redux. The only connection is that RTK Query has the ability to auto-generate React hooks if you do import { createApi } from '@reduxjs/toolkit/query/react', and in that case it needs some version of React and React-Redux with hooks capability available. The peer dependencies on RTK itself are not up to date, so you might get a warning that it needs React-Redux v7 or something, but the actual APIs are completely the same and it will work just fine.

I've read something about no longer requiring memoized selectors

I'm not sure what you're referring to here:

• Memoized selectors are not a React concept, it's a Redux concept
• Reselect is still the right tool to use for generating memoized selectors

See https://redux.js.org/usage/deriving-data-selectors

The biggest change in updating to React 18 should be switching your app to use ReactDOM.createRoot() instead of ReactDOM.render(), per the React 18 upgrade instructions:

reactwg/react-18#6

Bumping React-Redux to v8 beta.1 should "just work" if you've got React 18 installed.

[JonCognioDigital]

Thanks for the quick reply.

I was referring to the section in the middle of this discussion called "Selectors no longer need to be memoized"

reactwg/react-18#86

But maybe I'm getting myself confused.

[markerikson]

@jon64digital short answer: that's completely unrelated and not anything you have to worry about :)

Longer answer: That's talking about the new React useSyncExternalStore hook, which is solely intended for use by libraries like React-Redux. The initial design of that API was possibly going to require all selectors it received to be memoized in order for it to work right, but after we talked with the React team, they changed the design so it works with any selector function. React-Redux does use useSyncExternalStore internally, but it's an implementation detail that your code doesn't care about at all.

[TbirdDuncan]

I'm curious as a preact developer, would I have to use the compat entry point over just importing react-redux?

[markerikson]

Presumably yes, because the main entry point specifically imports the useSyncExternalStore hook directly from React and needs it to be there. If Preact ever adds that, then this would hopefully work as-is.

As I mentioned in the announcement, my working assumption is that anyone who opts to use the /compat entry point would do so at the build tool level, because any other libraries that might be importing something from 'react-redux' aren't getting updated to pull from the compat point.

Alternately, you can keep using React-Redux v7.x. It's there, and it works fine.