Our great sponsors
- Appwrite - The Open Source Firebase alternative introduces iOS support
- Sonar - Write Clean JavaScript Code. Always.
- ONLYOFFICE ONLYOFFICE Docs — document collaboration in your environment
- CodiumAI - TestGPT | Generating meaningful tests for busy devs
- InfluxDB - Access the most powerful time series database as a service
-
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
-
speaker.app
Source code for https://speaker.app, a batteries-included, web-based, quasi-decentralized, WebRTC networking platform, with a primary focus on audio and screen-sharing, and a secondary focus on chat messages and peripheral features.
I prefer sticking w/ the basics and using EventEmitter.
https://speaker.app has a UI I've been prototyping w/ this approach.
-
Appwrite
Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!
-
Thanks for sharing this, I found this paradigm to be highly intuitive. Adding a link to the HTMX docs which also do a great job of explaining: https://htmx.org/
-
Jotai [1] is my go to, though I have never used it for anything too big.
-
I like valtio, works w/ React or just js. Has subscribe, derive, and more.
-
Actually, Svelte uses Effector for state management under the hood. You can read more about it here: https://effector.dev/. It also has bindings for other frameworks including React, Vue and Solid. Effector is a little not beginner-friendly, but once you truly understand it, Effector becomes a very powerful.
-
Zustand is great: https://github.com/pmndrs/zustand
It gets out of the way in terms of boilerplate, has a good solution for avoiding unnecessary re-renders, has tooling for deep state updates without messy syntax (immer) and strikes an overall good balance between powerful and easy to use. Cons might be that it is a bit more obscure so people might have to learn it. Also the learning curve is a bit steep. YMMV
-
Sonar
Write Clean JavaScript Code. Always.. Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.
-
I use a simple 4 point system for state management:
https://github.com/prettydiff/wisdom/blob/master/state_manag...
I use it for an OS GUI here which fully loads in 200ms in Chrome (300ms Edge):
https://github.com/prettydiff/share-file-systems
When simple things, like state management, become complicated they are either over engineered or poorly planned.
-
Like most systems, it’s all about how it is setup. I’ve learned over 5-7 years how to organize FE (with redux) code so it is readable. Also inheriting a system can be quite the burden and I could see how it was be difficult to grok.
I also heavily leverage https://github.com/neurosnap/robodux to treat redux as a database.
At the end of the day, redux is an event emitter (pub/sub) with a single object that stores all of your state that multiple components need to reuse.
-
