反応とは何ですか？反応は主に何をするのですか? (質疑応答)

この記事では、主に react についての基本的な理解を紹介します。そうでない場合は、この記事をご覧ください

1. React?

Facebook エンジニアが大規模なプロジェクトに取り組んでいたとき、MVC は非常に巨大なコード ベースと巨大な組織のためにすぐに非常に複雑になり、新しい機能を追加する必要があるたびに、機能の複雑さが増しました。システムが急激に増加し、コードが脆弱になり、予測不能になるため、Facebook は、システム内に多数のモデルと対応するモデルが存在する場合、MVC は大規模なアプリケーションには適さないと考えています。モデルを表示すると、その複雑さが急速に拡大し、特にモデルとビューの間で起こり得る双方向のデータ フローの理解とデバッグが非常に困難になります。

上記の理由に基づいて、Facebook は MVC では拡張ニーズを満たすことができないと考えており、上記の問題を解決するには、「コードをより予測しやすくするために特定の方法でコードを編成する」必要があると考えています。 Flux と React がそれを実装することを提案しました。

2、 Reactとは

React これは Facebook の内部プロジェクトとして誕生しました。同社は市場にあるすべての JavaScript MVC フレームワークに満足できなかったため、独自のフレームワークを作成して Instagram Web サイトを構築することにしました。作ってみて、このセットがとても便利だったので、2013年5月にオープンソース化しました。

React は、ユーザー インターフェイスを構築するための JavaScript ライブラリです。 React は主に UI の構築に使用されると多くの人が考えています React は MVC の V (ビュー) です。 React は高いパフォーマンスと非常にシンプルなコード ロジックを備えており、ますます多くの人が注目し、使用し始めています。

3. React はどのような問題を解決しますか?

私たちは、大規模なアプリケーションの構築という 1 つの問題を解決するために React を構築しました 時間の経過とともに変化するデータを使用して大規模なアプリケーションを構築する

4. React の機能 1. −Reactは、アプリケーションの記述を容易にする宣言型パラダイムを採用しています。

2.効率的 −Reactは、

DOM

をシミュレートすることにより、DOMとの相互作用を最小限に抑えます。

3.柔軟 −Reactは、既知のライブラリやフレームワークとうまく連携します。

4.JSX − JSXはです JavaScript構文の拡張機能。 Reactは開発には使用できません JSXですが、それを使用することをお勧めします。

5.コンポーネント − React を通じてコン​​ポーネントを構築すると、コードが再利用しやすくなり、大規模プロジェクトの開発に適切に適用できます。

6.

一方向の応答データフロー − React は一方向の応答データ フローを実装することで重複コードを削減し、そのため従来のデータ バインディングよりもシンプルになっています。

5. React の主な原則

従来の Web アプリケーションでは、DOM 操作は通常直接更新されますが、DOM の更新は通常比較的高価であることがわかっています。 DOM に対する操作をできる限り減らすために、React は直接 DOM 操作を行う代わりに、DOM を更新するための別の強力な方法を提供します。これは VirtualDOM、つまり軽量の仮想 DOM であり、React によって抽象化されたオブジェクトであり、DOM がどのように見えるべきか、どのように表示されるべきかを記述します。このバーチャルを通じて DOM は実 DOM を更新し、この仮想 DOM が実 DOM の更新を管理します。 (さらに詳しく知りたい場合は、PHP 中国語 Web サイトReact Reference Manual の列にアクセスして学習してください)

なぜこの追加レイヤーの仮想 DOM 操作によって高速化できるのでしょうか? これは、React には diff アルゴリズムがあり、VirtualDOM を更新しても実際の DOM がすぐに影響を受けるとは限りません。React はイベント ループが終了するまで待機し、この diff アルゴリズムを使用して現在の新しい dom 表現を比較して最小ステップを計算します。前の DOM を更新します。

最も明白な利点は、React のいわゆる dom diff で、デルタレベルの dom 更新を実現できます。データの変更によって DOM が変更される場合、React はグローバルに更新しませんが、内部の dom diff アルゴリズムを通じて差分を計算し、最小の粒度で更新します。これは、React が優れたパフォーマンスを持っていることが知られている理由でもあります

。

6. コンポーネント コンポーネント

DOM ツリー上のノードは要素と呼ばれますが、ここでは Virtual DOM 上のコンポーネントと呼ばれます。 Virtual DOM のノードは、コンポーネントで構成される完全な抽象コンポーネントです。コンポーネントはで使用されます コンポーネントの存在により DOM diff の計算が効率化されるため、React ではこれは非常に重要です。

7. アプリケーション

Facebook、Yahoo、Redditなど、海外のアプリケーションがたくさんあります。 Sites-Using-React のリストは github で見ることができます: https://github.com/facebook/react/wiki/Sites-Using-React 中国にお住まいの方は調べてみましたが、比較的あるようです。現在、私が知っているのは杭州にある車です。一般に、ほとんどの技術は国内での応用が遅れています。

8. 比較分析

Backbone、Angular などの他の JS フレームワークと比較して、React はどうですか?

1. MVC フレームワークは、UI、つまりビュー層を中心に繰り返し呼び出されやすい Web コンポーネントを構築することです

2 つ目は、React はデータからビューへの一方向のレンダリングです。非双方向データバインディング

3. DOM オブジェクトを直接操作するのではなく、仮想 DOM を使用して、diff アルゴリズムを通じて最小限のステップで実際の DOM に適用します。

4. DOMを直接操作するのは不便です

9. React Nativeとの関係。 React Unique の極端な設計アイデアにより、革新的なイノベーション、優れたパフォーマンス、しかし非常にシンプルなコード ロジックが実現されています。そのため、これが Web の未来である可能性があると考え、ますます多くの人々がこれに注目し、使用し始めています。 開発用の主流ツール。

プロジェクト自体は、初期の UI エンジンからフロントエンドとバックエンドの Web アプリ ソリューションの完全なセットに至るまで、どんどん大きくなっていきました。派生した React Native プロジェクトにはさらに野心的な目標があり、それを Web アプリの作成に使用したいと考えています。 ネイティブアプリの書き方。それが実現できれば、インターネット業界全体がひっくり返るでしょう。なぜなら、同じグループの人々が UI を一度書くだけでよく、サーバー、ブラウザ、携帯電話で同時に実行できるからです。

この記事はここで終わります (さらに詳しく知りたい場合は、PHP 中国語 Web サイトの

React ユーザー マニュアル

列にアクセスして学習してください)。ご質問がある場合は、以下にメッセージを残してください。

以上が反応とは何ですか？反応は主に何をするのですか? (質疑応答)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。