メインコンテンツへスキップ
非公式ベータ版翻訳

このページは PageTurner AI で翻訳されました(ベータ版)。プロジェクト公式の承認はありません。 エラーを見つけましたか? 問題を報告 →

Redux FAQ: 一般

Reduxを学ぶべきタイミングは?

JavaScript開発者にとって、何を学ぶかは圧倒的な問題になりがちです。選択肢を絞るには、一度に一つずつ学び、仕事で直面する問題に焦点を当てると効果的です。Reduxはアプリケーションの状態管理パターンです。状態管理に問題がない場合、Reduxの利点を理解するのは難しいかもしれません。ReactのようなUIライブラリには独自の状態管理システムがあります。これらのライブラリを使用している場合、特に学習中であれば、まず組み込みシステムの機能を学ぶことをお勧めします。それだけでアプリケーション構築に十分な場合もあります。状態がどこに保存されているのか、状態がどのように変化するのか混乱するほどアプリケーションが複雑になったら、Reduxを学ぶ良いタイミングです。

ヒント

ほとんどの初心者は、まずReactの学習に集中し、Reactに慣れてからReduxを学ぶことをお勧めします。これにより、一度に学ぶ新しい概念が減り、どの概念がReactの一部で、どの概念がReduxの一部かが明確になります。また、Reduxの使用がReactアプリにどのように組み込まれるか、Reduxがなぜ有用なのかをより深く理解できるようになります。

参考情報

記事

ディスカッション

Reduxを使うべきタイミングは?

すべてのアプリがReduxを必要とするわけではありません。構築しているアプリケーションの種類、解決すべき問題の種類、そして直面している問題に最適なツールを理解することが重要です。

Reduxは共有状態の管理を支援しますが、どのツールにもトレードオフがあります。Reduxはコードを最短・最速で書くための設計ではありません。「状態の特定の部分がいつ変化したか?データはどこから来たか?」という問いに予測可能な動作で答えることを目的としています。学ぶべき概念が増え、書くコードも多くなります。コードに間接性が追加され、特定の制約に従う必要もあります。これは短期的生産性と長期的生産性のトレードオフです。

Reactの初期貢献者であるPete Huntは次のように述べています:

Fluxが必要な時はわかるはずです。必要かどうか確信が持てないなら、必要ありません。

同様に、Reduxの共同作成者であるDan Abramovは次のように述べています:

補足します:プレーンなReactで問題が発生するまでReduxを使わないでください。

Reduxが特に有用なケース:

  • アプリケーションの状態が大量にあり、アプリ内の多くの場所で必要となる場合

  • アプリの状態が頻繁に更新される場合

  • 状態を更新するロジックが複雑になる可能性がある場合

  • 中規模〜大規模のコードベースを持ち、多くの開発者が関わる可能性がある場合

  • 状態が時間とともにどのように更新されているかを可視化する必要がある場合

Reduxと同じ課題(状態管理、サーバーデータのキャッシング、UI間でのデータ受け渡しなど)を解決できるツールは他にも多数存在します。

情報

Reduxが自分のアプリに適しているか判断できない場合、以下のリソースが参考になります:

結局のところ、Reduxは単なるツールです。優れたツールであり、使用する明確な理由はありますが、使わない方が良い理由も存在します。ツール選択は十分な情報に基づいて行い、各決定に伴うトレードオフを理解することが重要です。

参考情報

ドキュメント

記事

ディスカッション

ReduxはReact専用ですか?

ReduxはあらゆるUIレイヤーのデータストアとして使用できます。ReactやReact Nativeとの組み合わせが最も一般的ですが、Angular、Angular 2、Vue、Mithrilなど向けのバインディングも提供されています。Reduxは基本的にサブスクリプション機構を提供するもので、あらゆるコードで利用可能です。ただし、Reactや類似ライブラリのように状態変化からUI更新を推論できる宣言的ビュー実装と組み合わせることで真価を発揮します。

Reduxを使うのに特定のビルドツールは必要ですか?

ReduxはモダンなJS構文(ES2020)で記述されていますが、コードは非常にシンプルです。

古いブラウザを対象とする場合は、ご自身でトランスパイルしてください。

counter-vanillaの例では、Reduxを<script>タグで含めた基本的なES5の使用方法を示しています。関連するプルリクエストで述べられている通りです:

この新しいCounter Vanillaの例は、ReduxがWebpack、React、ホットリロード、saga、アクションクリエイター、定数、Babel、npm、CSSモジュール、デコレータ、流暢なラテン語、Eggheadのサブスクリプション、博士号、または「期待を超える」O.W.L.レベルを必要とするという誤解を解くことを目的としています。

いいえ、必要なのはHTML、手作りの<script>タグ、そして昔ながらのDOM操作だけです。お楽しみください!