I ended up rolling my own state management that lets you just write a normal JS class with normal fields and methods and use that for accessing and modifying your state. No reducers, atoms, stores, etc... Just a JS class for your state and logic.
I've got the feeling that I can render anything I want the way I want with React (even 3-d worlds!) but the only framework that comes close to what my old systems could do is
https://mobx.js.org/README.html
and I cannot understand why MobX isn't more popular than it is. (Worked fine for a websocket-based app to control my smart speakers, it was trivial to make it so adjusting the speaker volume through the mobile app or buttons was reflected on my web app. Never tried a bigger app)
Our bottleneck was that we have so much data, making it all observable up front led to slow initial load times and high memory usage. We now make things observable on demand which has eliminated a lot of that.
I miss it when working with languages other than JavaScript.
1. They can easily provide derived data without manual memoization.
2. You can provide custom setters that do more than just assign values.
3. Your UI only re-renders the parts that reference fields that changed, not every component.
4. Atoms compose nicely etc.
Putting plain JS objects in context/state and passing them around only really works for simple, small apps. Beyond that you need more powerful tools. I also like Zustand for this.
Zustand looks a bit better but it is still very different from normal JS. Nobody writes code like that normally. Why can't we have normal, boring code for state management?
https://github.com/Facepunch/react-class-model
7 stars on github? Class objects with decorators? No thanks.
What's wrong with decorators? Technically not needed but I like things being explicit.