EY-Office ブログ

Redux libraryは今後どうなるの?

Reactで大規模なアプリを作るのには Redux を使うのが当たり前になって久しと思いますが、React 16.3 の Context や 16.8 の Hooks 以来、Redux が 揺れ出しているように感じられます。

ReactはSPAを構築するのには優れた表示用ライブラリーです、しかし大規模なアプリになると状態や表示データを保持する state の管理が困難になります。そこに登場したのが Redux です、Reduxを導入する事で

  1. 集中的に安全に状態(state)を管理できる
  2. コードの書き方(actions, reducers, store)が統一出来て、メンテナンス性が上がる
  3. ネストしたコンポーネント間でpropsをバケツリレーする必用がなくなる

3.はコードを書くときには大きなメリットです、 そして同じような事が出来る Context が登場した際に、もう Redux は要らない(Redux is dead)と言いだす人がいましたが、私はそこは Redux の本質ではないと思います。

Redux

今回、取り上げたいのは Redux という概念ではなく、 Redux というライブラリーそのものです。

Redux Starter Kit

Reduxの欠点の一つは、やたらとコードを書かなければいけない事です。しかも凡庸なコードばかり。その問題に対するRedux開発チームの回答が Redux Starter Kit ではないでしょうか。ホームページに A simple batteries-included toolset to make using Redux easier と書かれているように、コード量を減らすためのAPIが追加されています。

例えば createSlice は一つの関数で action, reducer を作れるものです。

Redux 公式 Hooks

ReactのHooks リリースに合わせ Reduxからも公式の Hooks がリリースされました。主に React Redux、ReactとReduxを繋ぐ部分のお呪いのようなコードが Hooks でスッキリ書けるようになるのもです。
Hooksの良さが感じられるAPIです。

React純正の useReducer

そして驚きなのが、React(Facebook)純正の Hooks にある useReducer です。ドキュメントには 「useState の代替品です」と書かれていますが、どう見ても Reduxのreducerです。

Bridging the Gap between React’s useState, useReducer, and Redux というブログに、 useReducer の良い例が書かれています。
Reduxというライブラリーはまったく使わず、Reduxという概念を実装しています。

今回のまとめ

Reduxという概念は定着していますが、実装としてもReduxは揺れていると思います。ひょっとすると新しいライブラリー(実装)が現れて一夜にしてメインストリームが変わってしまうかも知れません。
このような激動の時期ですが、重要なのはReduxという概念は安定している事です。表面上の動きに右往左往するのでは無く、しっかり基本を押さえておく事が重要だと思います。

- about -

EY-Office代表取締役
・プログラマー
吉田裕美の
開発者向けブログ