O hirunewani blog

Reactの状態管理ライブラリについて比較雑感

Created at

Reactの状態管理ライブラリであるJotai、Recoil、Redux、Zustandについて比較した雑感。

質問を受けて、その場で話しながら書いたメモなので多分に間違いがあるかもしれない。

  • jotai
    • Atomベース
      • 複数のアトムで、それを合成して提供する
    • Storeベースとは異なり複数のAtomで状態管理
    • Redux DevToolsが利用できる
    • ほぼRecoilと同じでより完結に書ける
      • 一意のkeyなどを気にしなくて良い
    • useState+useContextの置き換えと見ることができる
      • これはRecoilと同じ
  • recoil
    • Atomベース
    • Storeベースとは異なり複数のAtomで状態管理
    • Meta製なので将来性はあるかも
    • パッケージサイズがかなり重い
    • 状態を一意のkeyを使って管理する
    • 未だ実験的な機能
    • コアメンバが解雇されほぼ放置されている
  • redux
    • Storeベース
      • Storeという1つのオブジェクトとして管理し、各コンポーネントから参照できる
      • 誤解されがちだが、Storeが1つである必要はない
    • Redux-Toolkitを利用しないとかなり冗長な記述になる
  • zustand (チュースタンド)
    • Storeベース
      • シングルステート
      • Reduxよりも明示的に複数のオブジェクトを作れるため、Atomベース寄り
    • Redux-Toolkitをさらに簡単にした感じ
    • サイズが軽い
    • Redux devToolsを利用できる
    • 2022年度JavaScript Rising Startsで一番人気
    • 個人的には、SWRやReact Queryなどを利用し、適切にコンポーネントを切っていれば状態管理ライブラリが本当に必要になるケースというのは、かなり限られると思っている。
    • そもそも個人的にはSWRやReact Queryも、状態管理ライブラリだと思っている。