3 つの主流の Web フロントエンド フレームワーク: 1. Angular、強力なモジュール関数とカスタム コマンドを備えた単一のアプリケーション インターフェイスを作成するために使用されるフロントエンド フレームワーク。 2. React、ユーザー インターフェイスの構築に使用される JavaScript 開発フレームワーク。 UI の構築; 3. vue は、ユーザー インターフェイスを構築するための先進的な JavaScript フレームワークであり、ビュー層のみに焦点を当てており、学習や他のライブラリや既存のプロジェクトとの統合が非常に簡単です。
このチュートリアルの動作環境: Windows 7 システム、Dell G3 コンピューター。
ここ10年でIT業界は急速に発展し、UIデザイナー、開発エンジニア、ソフトウェアテストエンジニアなど、多くの新しい職業が誕生しました。その中でも注目を集めているのがWebフロントエンドエンジニアです。彼ら。では、Web フロントエンドの 3 つの主流フレームワークとは何でしょうか?
3 つの主流の Web フロントエンド フレームワークは、Angular、React、Vue です。
1. 角度のある
AngularJS は 2009 年に Misko Hevery らによって作成され、後に Google に買収されました。多くの製品で使用されている優れたフロントエンド JS フレームワークです。これは、高度なコンセプトを備えたフロントエンド開発フレームワークであるだけでなく、エンドツーエンドのソリューションでもあります。これは、アーキテクチャ設計における MVC パターンに従い、データと論理処理コンポーネントの疎結合を提唱します。 AngularJSは命令技術によりHTMLの自然な拡張を実現し、コンパイル技術によりデータモデルと表示ビューの双方向の自動同期を実現し、複雑なDOM操作を軽減します。さらに、フロントエンドの自動テストテクノロジの優れたサポートも提供します。
Angular は、単一のアプリケーション インターフェイスを作成するためのフロントエンド フレームワークであり、データ バインディング、サービス、ディレクティブ、依存関係の挿入などの多くのコア機能を備えています。強力なモジュール機能とカスタムコマンドの利点を備えています
特性：
1. 優れたアプリケーション構造
2.双方向のデータバインディング
3.注意事項
4.HTMLテンプレート
5. 埋め込み、注入、テストが可能
アドバンテージ：
1. テンプレートは強力で機能が豊富で、非常に豊富な Angular 命令セットが付属しています。
2. サービス、テンプレート、双方向データ バインディング、モジュール化、ルーティング、フィルター、依存関係注入、その他の機能を含む、比較的完全なフロントエンド フレームワークです。
3. 命令をカスタマイズします。命令をカスタマイズした後は、プロジェクト内で複数回使用できます。
4. ng モジュール化では、Java のいくつかの要素 (依存性注入) を大胆に導入しています。これにより、再利用可能なコードを簡単に作成できるようになり、アジャイル開発チームにとって非常に役立ちます。
5.angularjs はインターネット大手の Google によって開発されており、これは強固な基盤とコミュニティ サポートがあることも意味します。
欠点:
1. angular を始めるのは簡単ですが、深くなると、学習中に理解するのが難しい概念がたくさんあります。
2. ドキュメントにはサンプルがほとんどありません。多くの場合、公式ドキュメントにはサンプルがなく、Google から具体的な手順を入手するか、Angular の作者である Misko に直接問い合わせることができます。
3. IE6/7 との互換性はあまり良くありませんが、jQuery を使用して独自のコードを記述し、いくつかの問題を解決できます。
4. 命令の適用に関するベスト プラクティス チュートリアルはほとんどありません。実際、Angular は非常に柔軟です。たとえば、JS にはさまざまなコードが記述されます。 jQueryに似ています。
5. コード圧縮が必要な場合、DI 依存関係の注入には明示的な宣言が必要です。
2.反応する
Facebook が開発した React は、angular より 4 年遅れて 2013 年に正式にリリースされましたが、その革新的な VirtualDOM のおかげで、リリースされると非常に人気になりました。 VirtualDOM、JSX、Diff アルゴリズムなどを含む多くの機能があり、ES6 構文をサポートし、関数型プログラミングを使用します。しきい値は若干高くなりますが、柔軟性が高いため、より多くの開発の可能性が得られます。
特性
1. 宣言型設計: React は宣言型パラダイムを採用しているため、アプリケーションの記述が容易になります。
2. 効率的: React は DOM をシミュレートすることで、DOM との対話を最小限に抑えます。
3. 柔軟性: React は既知のライブラリやフレームワークとうまく連携します。
アドバンテージ：
1. 高速: UI レンダリング プロセス中に、React は仮想 DOM でのマイクロ操作を通じて実際の DOM に部分的な更新を実装します。
2. クロスブラウザーの互換性: 仮想 DOM は、クロスブラウザーの問題を解決するのに役立ちます。IE8 でも問題ない標準化された API を提供します。
3. モジュール化: プログラム用に独立したモジュール式 UI コンポーネントを作成します。これにより、1 つまたはいくつかのコンポーネントに問題が発生したときに、それを簡単に分離できます。
4. 一方向データ フロー: Flux は、JavaScript アプリケーションで一方向データ レイヤーを作成するためのアーキテクチャです。 5. 同型の純粋な JavaScript: 検索エンジン クローラーは JavaScript の実行ではなくサーバー側の応答に依存するため、アプリのプリレンダリングSEOに役立ちます。 6. 優れた互換性: たとえば、RequireJS は読み込みとパッケージ化に使用されますが、Browserify と Webpack は大規模なアプリケーションの構築に適しています。これらの困難なタスクをそれほど困難にしないでください。欠点: React 自体は単なる V であり、完全なフレームワークではないため、大規模なプロジェクト用の完全なフレームワークが必要な場合は、基本的に、大規模なアプリケーションを作成するために ReactRouter と Flux を追加する必要があります。
3.ビュー
最後のフレームワークとして (2014 年に) リリースされた Vue は、前任者の angular および React の機能 (VirtualDOM、双方向データ バインディング、差分アルゴリズム、レスポンシブ プロパティ、コンポーネント開発など) を利用し、関連する最適化を行って、より便利で、簡単に始めることができますが、初心者にはあまり適していません。
特性：
1.軽量フレームワーク
2.双方向のデータバインディング
3.注意事項
4. プラグイン
アドバンテージ：
1. シンプル: 公式ドキュメントは非常に明確で、Angular よりも学びやすいです。
2. 高速: 非同期バッチ処理で DOM を更新します。
3. 構成: 分離された再利用可能なコンポーネントを使用してアプリケーションを構成します。
4. コンパクト: ~18kbmin+gzip、依存関係なし。
5. 強力: 式は、依存する推定可能なプロパティ (computedproperties) を宣言する必要がありません。
6. モジュールに優しい: NPM、Bower、または Duo を通じてインストールできます。すべてのコードが Angular のさまざまな規制に従う必要はなく、使用シナリオはより柔軟です。
欠点:
1. 新生: Vue.js は新しいプロジェクトであり、Angular ほど成熟していません。
2. 影響はそれほど大きくありません。グーグルで調べたところ、Vue.js の多様性や豊富さは他の有名なライブラリに比べて劣っていることがわかりました。
3. IE8には対応しておりません。
拡張知識: Vue.js と他のフレームワークの違いは何ですか?
1.AngularJSとの違い
類似点:
どちらも、組み込み命令とカスタム命令の命令をサポートします。
どちらもフィルタ (組み込みフィルタとカスタム フィルタ) をサポートしています。
どちらも双方向のデータ バインディングをサポートしています。
どちらもローエンドのブラウザをサポートしていません。
違い:
1. AngularJS は、Dependency Injection 機能の追加など学習コストが高いのに対し、Vue.js 自体が提供する API は比較的シンプルで直感的です。
2. パフォーマンスの点では、AngularJS はデータのダーティ チェックに依存しているため、Watcher が増えるほど速度が遅くなります。
Vue.js は依存関係追跡ベースの観察を使用し、非同期キュー更新を使用します。すべてのデータは独立してトリガーされます。
大規模なアプリケーションの場合、この最適化の違いは明らかです。
2. Reactとの違い
類似点:
React は特別な JSX 構文を使用し、Vue.js もコンポーネント開発で .vue 特別なファイル形式を記述することを推奨しています。ファイルの内容にはいくつかの規則があり、使用するには両方をコンパイルする必要があります。
中心となる考え方は同じです。すべてがコンポーネントであり、コンポーネントのインスタンスはネストできるということです。
いずれも合理的なフック関数を提供しており、開発者がニーズをカスタマイズできるようにします。
Column AJAX、Route、その他の機能はコア パッケージには組み込まれておらず、プラグインとして読み込まれます。
ミックスインの機能はコンポーネント開発でサポートされています。
違い:
React は Virtual DOM に依存しますが、Vue.js は DOM テンプレートを使用します。 React によって使用される仮想 DOM は、レンダリングされた結果に対してダーティ チェックを実行します。
Vue.js は、DOM を非常に便利かつ迅速に操作できる命令やフィルターなどをテンプレートで提供します。
上記は、3 つの主流の Web フロントエンド フレームワークの詳細な内容です。詳細については、このサイトの他の関連記事に注目してください。