redux VS xstate

replace global state managers like Redux or Vuex

Redux is a library used for global state management, meaning if you have a piece of state that you want to access in different places of your app, you can use Redux to manage that state and make it easily accessible anywhere. The global state can be anything from logged-in user information to UI state such as theme, etc.

Now go ahead and import createSlice from the same library and create a reducer with it. createSlice is a wrapper around the old API from redux which reduces quite some boilerplate when creating reducers.

This post is going to help you get rid of the acid Redux associated with trying to use vanilla Redux.

Redux Docs

Redux is a library for managing and updating application state using events called actions. It serves as a centralized store for state, that needs to be used across your entire application(instead of props drilling), with rules ensuring that the state can only be updated in a predictable fashion.

By using React Context, we make our code ma lot more concise. Which also eliminates the props drilling problem. Aside from React context, there are also another options available like Redux or MobX which is a global state management.

> > I maintain my 2017 apps including major version bumps with no issues today

> Sorry but I have to call bullshit on that, unless you’re taking about tiny one page “apps”

What a strange stance. It's a React/MobX collaborative model editing internal tool deployed in production to users who generate and analyze models with it. It started on Webpack 2 and React 15 and MobX 4, now it's on Webpack 5 and React 17 and MobX 6. I of course had to update some babel configurations but it was much more version bumping than configuration rebuilding. It still uses decorators and looks like complete dog-shit, and that's my point: the same tricks and patterns available then are not only there, but working identically now.

Re: native, I don't believe in React Native or any webview-based "native" replacement anyways, but it's easy to do this as my user-base is interacting with this app from their company-provided laptops anyways. I would willingly concede React Native is an environment with churn, I don't really recall RN every reaching meaningful stability

> Redux is dead in the water

https://www.npmjs.com/package/redux shows 7M downloads weekly

https://www.npmjs.com/package/react-redux shows 5M

https://www.npmjs.com/package/@reduxjs/toolkit shows 1.5M

MobX / MobX React are around 1M/700k

Your list of "flummox / redux / unstated / mobx / mobx-state-tree / xstate / apollo / apollo-link-state / swr / react-query / zustand / recoil / jotai" seems to peak at 500k with the exception of "react-query", which I don't really see as applicable to a conversation about state management, and perfectly illustrates my point that there's new stuff but you don't need to know it

> you say it’s #1, but Redux is dead in the water

I never personally believed in Redux, it struck me as a terrible pattern from the start, thus why I selected MobX; but I find it difficult to believe that you really think React Context scales the same way building an external state management tree does. I like React Context, but it doesn't do a very good job of hiding away complexity from the developer as the application grows. Not to mention it does no render-optimization for you.

Again, I'm not saying things don't change or that there's not alternatives, but I am saying that someone who learned fundamentals in 2017 is still able to get up-to-speed in the updated versions of the library kings of 2017 in virtually no time, and deliver standard-fare webapps. I say this because I've worked at the same place for over 5 years, I use the same tools, and my users regularly are telling me the tools my team puts in front of them are the gold standard. The churn is long gone, everything you describe would have perfect analogues in any other popular modern language / library ecosystem.

Use of global state management libraries e.g. Redux, MobX and XState.

I guess there is no need to persuade any longer! For more info check the official docs

A client for XState, with a full DSL system via macro.

So I turned to google to see if anyone else was having this issue, and discovered a few interesting posts including these two: How should a machine interact with websocket? and XState Websocket Machine.

Redux is an option for us, but one of the developers proposed using a state-machine based library, in particular the xstate library.

For context - He wrote xstate, one of the more complex typescript projects out there. I have been using the lib as of late and was pretty surprised that he was able to get the typing to work everywhere. I am still having a hard time understanding how the generics work inside the project (and sadly have been using any’s in a lot of places) but still quite impressed that the entire library is typesafe. I think he is in the position to make this joke!

XState / XState React

XState / [XState React](https://xstate.js.org/docs/packages/xstate-react/

Algúnos frameworks en Javascript para el manejo de máquinas de estádo son: -Machina -Javascript State Machine -Xstate Mi preferido.

I use xstate (https://xstate.js.org/docs/). It is based on finite state machines. It is quite enjoyable to use when you get some experience with it. I would say It is much more reliable than redux for example because it eliminates usage of booleans.

There's also a lot of libraries offering opinionated ways to manage your entire (or part of) state, like Redux, Mobx, Recoil or XState.