ホームページ  >  記事  >  ウェブフロントエンド  >  Web フロントエンドの 3 つの主流フレームワークは何ですか?

Web フロントエンドの 3 つの主流フレームワークは何ですか?

青灯夜游
青灯夜游オリジナル
2022-07-12 18:07:0638603ブラウズ

3 つの主流の Web フロントエンド フレームワーク: 1. Angular は、単一のアプリケーション インターフェイスを作成するために使用されるフロントエンド フレームワークです。強力なモジュールとカスタム コマンドの利点があります。2. React は、ユーザーフレンドリーです。フレームワーク. ユーザー インターフェイスを構築するための JavaScript 開発フレームワーク, 主に UI の構築に使用されます; 3. vue はユーザー インターフェイスを構築するための進歩的な JavaScript フレームワークです. Vue のコア ライブラリはビュー層のみに焦点を当てており、非常に学習しやすく、簡単に作成できます。他のライブラリまたは既存のプロジェクト統合と統合されます。

Web フロントエンドの 3 つの主流フレームワークは何ですか?

このチュートリアルの動作環境: Windows 7 システム、Dell G3 コンピューター。

過去 10 年間で、IT 業界は急速に発展し、UI デザイナー、開発エンジニア、ソフトウェア テスト エンジニアなど、多くの新しい職業が誕生しました。数多くの新しい職業の中で注目を集めているのが Web です。フロントエンドエンジニアもその1人です。では、Web フロントエンドの 3 つの主流フレームワークとは何でしょうか?

主流の 3 つの Web フロントエンド フレームワークは、Angular、React、Vue です。

1. Angular

AngularJS は、2009 年に Misko Hevery らによって作成され、後に Google に買収されました。多くの製品で使用されている優れたフロントエンド JS フレームワークです。これは、高度なコンセプトを備えたフロントエンド開発フレームワークであるだけでなく、エンドツーエンドのソリューションでもあります。これは、アーキテクチャ設計における MVC パターンに従い、データと論理処理コンポーネントの疎結合を提唱します。 AngularJSは命令技術によりHTMLの自然な拡張を実現し、コンパイル技術によりデータモデルと表示ビューの双方向の自動同期を実現し、複雑なDOM操作を軽減します。さらに、フロントエンドの自動テストテクノロジの優れたサポートも提供します。

Angular は、単一のアプリケーション インターフェイスを作成するためのフロントエンド フレームワークであり、データ バインディング、サービス、ディレクティブ、依存関係の注入など、多くのコア機能を備えています。強力なモジュール機能とカスタム コマンドの利点を備えています

#特徴:

    #1. 優れたアプリケーション構造
  • #2. 双方向データ バインディング
  • 3. 手順
  • 4.HTML テンプレート
  • #5. 埋め込み、挿入、テストが可能

  • ##利点:

##1. テンプレート機能強力で豊富な、非常に豊富な角度命令セットが付属しています。

    2. これは、サービス、テンプレート、双方向データ バインディング、モジュール化、ルーティング、フィルター、依存関係注入、その他の機能を含む、比較的完全なフロントエンド フレームワークです。
  • 3. 命令をカスタマイズする 命令をカスタマイズした後は、プロジェクト内で複数回使用できます。
  • 4.ng のモジュール性は、アジャイル開発チームにとって、再利用可能なコードを簡単に記述できる Java の要素 (依存関係の注入) を大胆に導入しています。非常に役立ちます。
  • 5.angularjs はインターネット大手の Google によって開発されており、これは強固な基盤とコミュニティ サポートがあることも意味します。
  • 欠点:
1. Angular は簡単に始めることができますが、使い始めると多くの概念が必要になります。奥が深く、学習中に理解するのが難しいです。

2. ドキュメントの例が非常に少ないです。公式ドキュメントは基本的に API についてのみ説明しており、例はありません。多くの場合、具体的な使用方法は Google から提供されるか、直接提供されます。 Angular著者のMisko氏は尋ねます。
  • 3. IE6/7 との互換性はあまり良くありませんが、jQuery を使用して独自のコードを記述し、いくつかの問題を解決できます。
  • 4. 命令の適用に関するベスト プラクティス チュートリアルはほとんどありません。Angular は実際には非常に柔軟です。一部の作成者の使用原則に従わない場合でも、簡単に作成できます。 js や js などのさまざまなコード jQuery のように考えると、多くの dom 操作があります。
  • 5.DI 依存関係の注入では、コード圧縮が必要な場合は明示的に宣言する必要があります。
  • #2. React

React は Facebook によって制作され、正式バージョンは 2013 年にリリースされました。 angular 4 年かかりましたが、革新的な VirtualDOM のおかげで、パフォーマンスの点で angularJS を上回り、リリースされると非常に人気になりました。 VirtualDOM、JSX、Diff アルゴリズムなど多くの機能を備え、ES6 構文をサポートし、関数型プログラミングを使用するため、敷居は若干高くなりますが、柔軟性が高く、開発の可能性が広がります。

特徴

1. 宣言型設計: React は、アプリケーションを簡単に記述できる宣言型パラダイムを採用しています。

2. 効率: React は DOM をシミュレートすることで、DOM との対話を最小限に抑えます。
  • 3. 柔軟性: React は既知のライブラリやフレームワークとうまく連携します。
  • 利点:
1. 高速: UI レンダリング プロセス中に、React は実装するマイクロオペレーションを渡します。実際の DOM に対するローカル更新。

2. クロスブラウザーの互換性: 仮想 DOM は、クロスブラウザーの問題を解決するのに役立ち、IE8 でも問題ない標準化された API を提供します。
  • 3. モジュール化: プログラム用に独立したモジュール式 UI コンポーネントを作成して、1 つまたはいくつかのコンポーネントに問題が発生したときに、それを簡単に分離できるようにします。
  • 4. 一方向データ フロー: Flux は、JavaScript アプリケーションで一方向データ レイヤーを作成するためのアーキテクチャです 5. 同型の純粋な JavaScript: 検索エンジン クローラーが依存しているため、サーバー側でサービスを提供するJavaScript を実行する代わりにアプリを事前レンダリングすると、SEO に役立ちます。 6. 優れた互換性: たとえば、RequireJS は読み込みとパッケージ化に使用されますが、Browserify と Webpack は大規模なアプリケーションの構築に適しています。これらの困難なタスクをそれほど困難にしないでください。欠点: React 自体は単なる V であり、完全なフレームワークではないため、大規模なプロジェクト用の完全なフレームワークが必要な場合は、基本的に、大規模なアプリケーションを作成するために ReactRouter と Flux を追加する必要があります。

3、Vue

Vue は、(2014 年に) リリースされた最後のフレームワークとして、前任者の angular と反応機能 (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. 影響はそれほど大きくありません。Google で調べたところ、Vue.js の多様性や豊富さは他の有名なライブラリに比べて劣っていることがわかりました。

  • 3. IE8 はサポートされていません。

#知識を広げる: Vue.js と他のフレームワークの違いは何ですか?

1. AngularJS との違い

同じ点:

両方とも、組み込み命令とカスタム命令をサポートします。

どちらもフィルターをサポートしています: 組み込みフィルターとカスタム フィルター。

すべてが双方向のデータ バインディングをサポートしています。

はローエンドのブラウザをサポートしていません。

相違点:

1. AngularJS は依存関係の挿入機能の追加など、学習コストが高くなりますが、Vue.js 自体が提供する API は比較的シンプルで直感的です。

2. パフォーマンスの点では、AngularJS はデータのダーティ チェックに依存しているため、Watcher が増えるほど速度が遅くなります。

Vue.js は、依存関係の追跡に基づく観察を使用し、非同期キュー更新を使用します。すべてのデータは独立してトリガーされます。

大規模なアプリケーションの場合、この最適化の違いは明らかです。

2. React との違い

類似点:

React は特殊な JSX 構文を使用し、Vue.js ではコンポーネント開発で を記述することも推奨しています。 vue 特殊ファイル形式にはファイルの内容に関していくつかの規則があり、使用する前に両方をコンパイルする必要があります。

中心となる考え方は同じです。すべてがコンポーネントであり、コンポーネントのインスタンスはネストできるということです。

すべては合理的なフック関数を提供しており、開発者はニーズをカスタマイズできます。

には、列番号 AJAX、Route、およびその他の機能がコア パッケージに組み込まれておらず、プラグインとしてロードされます。

コンポーネント開発におけるミックスインの機能をサポートします。

違い:

React は Virtual DOM に依存しますが、Vue.js は DOM テンプレートを使用します。 React によって使用される仮想 DOM は、レンダリングされた結果に対してダーティ チェックを実行します。

Vue.js は、テンプレート内に命令やフィルターなどを提供しており、DOM を非常に便利かつ迅速に操作できます。

(学習ビデオ共有: Web フロントエンド )

以上がWeb フロントエンドの 3 つの主流フレームワークは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。