Why jotai?

[anilhelvaci]

We're trying to choose a state management tool for our frontend dapp. As I remember when this repo was called dapp-treasury, it was using autodux for state management which is an extension of Redux, I believe. So can you please explain what is the reason you chose jotai? Is it related to something like, I don't know, better compatibility with Hardened JS? Do you see any problem with choosing Redux? Thanks 🙏

cc @dckc

[samsiegart]

Ultimately it's a matter of what I was most comfortable with. To rationalize I would say...

Jotai is just a lot simpler than Autodux. While Autodux is like Redux with some magic, Jotai is basically a simplified version of Recoil. I think Redux in general is more suited for the class-based components of old, and Jotai feels more natural with function components. It's essentially a global useState hook that optimizes rendering automatically, and supports things like derived state that feel natural to use (example).

A downside of Jotai is that you cannot read or write state from outside a react component, you need to use the react hooks to access the store. This makes it inconvenient to implement our services which make many sequential queries and write to the store. To get around this we use Zustand, which is made by the same people as Jotai, and is more similar to a Redux pattern. We can write to the Zustand store from outside of our React components, and read it from our React components using hooks.

Note that you can also write Jotai Atoms that derive their state from the Zustand store. This makes it convenient to write a single hook, like useAtomValue(vaultToAdjustAtom), which is derived from multiple pieces of state and optimized. Another convenience Jotai offers is atomWithStorage which makes it super simple to persist state in local storage.

There's another common pattern of observables with the likes of Mobx, but I'm not a fan of mutable state. In general I prefer Jotai for most things, and throw in Zustand if you need to access the store from outside your React components. If we had a more simple API for reading all the vault state with a single query, rather than multiple sequential/dependent requests (i.e. query the vault managers list, then the metrics and params for each vault manager, etc.), I would prefer to just use https://tanstack.com/query/v3/ instead of Zustand.