Recoil

reduxとどう違うか？

stateに対してフィルタして別のstateを作るのが楽(derrived state)

data-flow-graphってこういうことか

asyncの扱いが楽

Recoil における状態の更新: Atom を更新する → Selector が更新される

Redux における依存関係の更新: あくまで状態管理のみ。取得はスコープ外

atomFamilyのところはあとで嵌りそう

redux dev toolのようなものがあるか？

officialにGUIはない

officialではないが

FAQ

atomとselectorの使い分け

arrayをatomにセットして、updateや要素のdeleteがしたい

しかし、ステートはread onlyで再代入不可なので、sliceを使って新たな配列を作り、そこに新しいオブジェクトを挿入する感じにしています。

replaceやremoveでも、sliceを使ってやっている

この辺のロジックをいい感じにrecoil側に移動してテストしやすくしたいんだけど

game loopとかで発生するイベントをrecoilに入れたいとき

eventをlistenして、setStateを呼ぶ

useRecoilCallback

Asynchronously read Recoil state without subscribing a React component to re-render if the atom or selector is updated.

d3.jsのintervalでグラフをアニメーションするようなときに、tickのタイミングでatomを読みたいが、react componentのre-renderはしたくない。というようなときに便利。re-renderをせずにatomにアクセスできる