April 23rd, 2022

Reactの状態管理にアプリの規模に何がいいのか試行錯誤してるメモ

まずRecoil、私が最初に導入した状態管理ライブラリ。

atomに値を保存してトップレベルのappをラップするとatomの状態をグローバルで使いまわせる。

いいと思ったところ（メリットなど）

・useStateとの置き換えにより使い分けがしやすい。・導入が簡単にできる上ファイルとコードが増えにくいため管理もしやすい。・ステート宣言に3個含ませるような事態が起きないので簡単に扱える。・現状もっともシンプル

微妙だなと思ったところ（デメリットとか）

・Keyが一意でないというエラーが常に出るのでそこだけ解消したい。・あとはとくになし、メリットの方が美味しい

次にRedux, storeとSliceを作成してappをstoreでラップする。

いいなと思ったところ（メリットなど）

・まだ実際に試していないので不明・今度追加する・細かいことができそうで正直あきらかに大規模アプリでは現状必須に見える

微妙だなと思ったところ（デメリットとか）

・とにかくファイルが増えるためただフック切ればいいというわけではないと思い知らされる

最後に

そもそもステート状態管理の前にコンポーネントの状態管理を考える必要はあると思います。これはappトップレベルを扱う上で全て共通の概念です。これらのステートマネージメントは管理を楽ににするというだけでそもそもバケツリレーをするなら必要ありません。

他にも、 Zustand、XState、Jotai、Immerなどいろいろあるみたいです。