React 16.3.0がリリースされ、Context APIは実験的な機能ではなくなりました。ダン・アブラモフ(Reduxのの作成者は)良いコメントを書き込みました。ここではこのことについて、コンテキストが、まだ実験的な機能だった2年でした。
私の質問は、あなたの意見/経験では、React ReduxよりもReact Contextをいつ使用する必要があるか、またはその逆ですか?
React 16.3.0がリリースされ、Context APIは実験的な機能ではなくなりました。ダン・アブラモフ(Reduxのの作成者は)良いコメントを書き込みました。ここではこのことについて、コンテキストが、まだ実験的な機能だった2年でした。
私の質問は、あなたの意見/経験では、React ReduxよりもReact Contextをいつ使用する必要があるか、またはその逆ですか?
回答:
コンテキストはもはや実験的な機能ではありません、あなたが直接あなたのアプリケーションのコンテキストを使用することができますし、それがために設計されたものを深くネストされたコンポーネントにデータをダウン渡すための素晴らしいことになるだろう。
Mark eriksonが彼のブログに書いているように:
小道具の受け渡しを避けるためにReduxのみを使用している場合、コンテキストがReduxを置き換える可能性がありますが、おそらく最初からReduxは必要ありませんでした。
また、コンテキストは、、
Redux DevTools
状態の更新を追跡するmiddleware
機能、一元化されたアプリケーションロジックを追加する機能、その他の強力な機能を提供しませんRedux
。
Redux
@danAbramovが述べたようにContext Api
、はるかに強力であり、が提供しない多くの機能を提供します
React Reduxは内部的にコンテキストを使用しますが、パブリックAPIでこの事実を公開しません。そのため、React Reduxを介してコンテキストを使用する方が、直接変更するよりもはるかに安全だと感じるはずです。なぜなら、変更された場合、コードの更新の負担は、あなたではなくReact Reduxにあるからです。
最新のコンテキストAPIに準拠するように実装を実際に更新するReduxまで
最新のContext APIは、コンポーネント間でデータを渡すためにReduxを使用するだけのアプリケーションに使用できますが、集中型データを使用し、アクションの作成者がAPIリクエストを処理するアプリケーションは、redux を使用するredux-thunk
か、redux-saga
それでも必要です。このreduxとは別に、redux-persist
ストアデータをlocalStorageに保存し、更新時に再水和できるようにする他のライブラリが関連付けられています。これは、コンテキストAPIがまだサポートしていないものです。
@dan_abramovが彼のブログで述べたように、あなたはReduxを必要としないかもしれません、そのreduxはのような便利なアプリケーションを持っています
- 状態をローカルストレージに永続化し、そのままそこから起動します。
- サーバーの状態を事前入力し、HTMLでクライアントに送信し、ボックスから起動します。
- ユーザーのアクションをシリアル化し、状態のスナップショットと一緒に自動化されたバグレポートに添付して、製品開発者
がエラーを再現できるようにします。- ネットワーク経由でアクションオブジェクトを渡し、コードの記述方法を大幅に変更することなく、協調的な環境を実装します。
- コードの記述方法に劇的な変更を加えることなく、元に戻す履歴を維持するか、楽観的な変更を実装します。
- 開発中の状態履歴間を移動し、コードが変更されたときにアクション履歴から現在の状態を再評価します。
- 製品開発者が
アプリのカスタムツールを作成できるように、開発ツールに完全な検査および制御機能を提供します。- ほとんどのビジネスロジックを再利用しながら、代替UIを提供します。
これらの多くのアプリケーションを使用すると、Reduxが新しいContext APIに置き換えられるとは言い切れません
小道具を深くネストされたコンポーネントに渡さないようにするためだけにReduxを使用している場合は、ReduxをContext
APIに置き換えることができます。これはまさにこのユースケースを対象としています。
一方、他のすべてにReduxを使用している場合(予測可能な状態コンテナーを持ち、コンポーネントの外でアプリケーションのロジックを処理し、アプリケーションの状態を一元化し、Redux DevToolsを使用して、いつ、どこで、なぜ、どのようにアプリケーションの状態を追跡するか変更、またはRedux Form、Redux Saga、Redux Undo、Redux Persist、Redux Loggerなどのプラグインを使用している場合)、Reduxを放棄する理由はまったくありません。Context
APIは、このいずれかを提供していません。
そして、私は個人的に、Redux DevTools拡張機能が、Reduxを使い続けることを正当化する驚くほど過小評価されているデバッグツールであると信じています。
いくつかの参照:
API呼び出し(Axiosも使用)を行い、応答をレデューサーにディスパッチするために、redux-thunkでreduxを使用することを好みます。綺麗で分かりやすいです。
Context APIは、Reactコンポーネントがストアに接続される方法に関するreact-reduxパーツに非常に固有です。これには、react-reduxが最適です。ただし、必要に応じて、Contextが正式にサポートされているため、react-reduxの代わりにContext APIを使用できます。
したがって、問題は、Context APIとreduxではなく、Context APIとreact-reduxである必要があります。また、質問は少し意見が分かれています。私はreact-reduxに精通しており、すべてのプロジェクトで使用しているため、引き続き使用します。(私が変更するインセンティブはありません)。
しかし、今日だけreduxを学習していて、どこでも使用していない場合は、Context APIを試して、react-reduxをカスタムContext APIコードに置き換える価値があります。たぶん、それはそのようにはるかにきれいです。
個人的には、親しみやすさの問題です。これらは同等であるため、どちらを選択するかについて明確な理由はありません。そして内部的に、react-reduxはとにかくコンテキストを使用します。
Reduxを使用する理由は次のとおりです。
アプリ全体の間接参照のレベルはおそらく必要ないため、スタイルを混在させ、ローカルの状態/コンテキストとReduxを同時に使用することは問題ありません。
- さまざまな目的でミドルウェアを使用する必要がある場合。たとえば、ロギングアクション、エラーレポート、サーバーの応答に応じて他のリクエストをディスパッチするなど。
- 複数のエンドポイントからのデータが単一のコンポーネント/ビューに影響を与える場合。
- アプリケーションのアクションをより細かく制御したい場合。Reduxは、アクションとデータ変更の追跡を可能にし、デバッグを大幅に簡素化します。
- サーバーの応答でアプリケーションの状態を直接変更したくない場合。Reduxはレイヤーを追加します。ここで、このデータを適用する方法、タイミング、および適用するかどうかを決定できます。オブザーバーパターン。アプリ全体で複数のパブリッシャーとサブスクライバーを作成する代わりに、コンポーネントをReduxストアに接続するだけです。
From:いつReduxを使うのですか?
duix
npmパッケージを確認してください。これは、コールバックを備えた単純な状態マネージャーであり、実装は非常に簡単です。明確にするために:私は作成者です。