mobx-state-tree VS mobx-vue-lite

Basic knowledge of Tailwind CSS and MobX-State-Tree

Folks disagreed with my comment yesterday criticizing Redux as an architecture, but this sort of illustrates my point. I'd suggest taking a look at Mobx State Tree, which automatically re-renders components only when they depend on the specific part of the state that changed. Other fields can change without triggering unnecessary re-renders, and developers don't have to worry about manually splitting the state to deal with performance problems.

mobx-state-tree (https://mobx-state-tree.js.org/)

Benefits of it over mobx is data normalization with references and JSON patches which allow you sync complex state easily. Typed models are also a plus.

Drawbacks are performance (see https://github.com/mobxjs/mobx-state-tree/issues/1267).

Previously was using immer, which I loved because of immutability but moved off since classes and OOP didn't feel as natural as in mst.

If I were to pick an alternative, might try redux with normalization https://redux.js.org/usage/structuring-reducers/normalizing-....

And if I were to build a state management tool, I would prioritize a library that has

MobX - or even MobX-state-tree if you prefer

As for state imba doesn't impose any paradigm on you - you are free to bring your own state managment. So you could use a library like mobx-state-tree.

We have covered almost all required topics from MobeX-State-Tree. MobeX provided few sample example, download ToDoMVC - app using React and MST and Bookshop - app with references, identifiers, routing, testing etc.

MobX-State-Tree -> MobX is a state management "engine", and MobX-State-Tree gives it structure and common tools you need for your app.

Recoil is cool, I would also recommend mobx-state-tree which is not much more complex to use and gives you nice type safety and reactivity. You can easily get a snapshot of the whole store and restore from it.