When to use

When to use Reactive state instead of Redux

"Another state container, seriously?" - everyone

Yes, another one. If you may ask why you should and when you would use reactive state over traditional redux, this page is for you.

Design philosophy

Let's face it: RxJS has a step learning curve. But like vim or emacs, it is definetely worth investing the time, and it will increase your productivity when dealing with async operations or callback hell in JavaScript/TypeScript. Reactive State was designed to fit with React and RxJS. But instead of a middleware or library that builds on top of redux, reactive-state was created to replace redux (and mobX, reselect, redux-saga/redux-thunk etc.) and build RxJS into its core, instead of glueing RxJS on top of redux (as i.e. Redux-Observable does).

Decision helper

When in doubt, use these criteria:

Use reactive-state if:

• You are familiar with the RxJS framework, or are willing and eager to learn it
• You understand what RxJS can do for you to make your async live easier
• You prefer Observables over Promises and async/await API in your day-to-day code

Don't use it if:

• You have no Idea what RxJS is and don't want to learn it
• You are happy with your existing react/redux/redux-thung/reselect stack
• You use RxJS only on occasion

Why reactive-state obsoletes many middlewares

When using reactive-state, you still have to grasp the (excellent) redux concept (I.e. know about store, state, action, reducer). But since you are already using RxJS and are familiar with it, you get most of the benefits with reactive-state where with redux, you would need to learn new libraries, middlewares and confusing project names.

When using reactive-state, RxJS will provide you with everything that is provided by these middlewares/libraries in the traditional redux world:

• Selector libraries (reselect, mobX) - Instead you just .select() from your store and get and observable that can be mapped, filtered, transformed, joined etc. in the way you already know. Changes on the state will immediately be emitted to your observable.
• Action creators: Actions are just Observables, you don't need to learn when and why to use action creators
• Async middlewares (redux-thunk, redux-sage) - RxJS is async all the way down. All actions are just observables, and they are async by design. You can subscribe to dispatch of actions just by subscribing to the observable, and perform the same transformations mentioned above. There are no additional abstractions added by reactive-state, it is plain RxJS.