なぜVueなのか?





Vue.jsライブラリは日々人気が高まっていますが、誰もがVueの理由を理解しているわけではありません。



技術的には、Vue.jsはMVVMテンプレートのViewModelレイヤーとして定義されています。 モデルとビューを双方向のデータバインディングに接続します。 現在のDOMの変更とフォーマットされた出力は、ディレクティブとフィルターで抽象化されます。



目標は、高速データバインディングと複雑なコンポーネント表現の利点を、シンプルで理解可能なAPIで提供することです。 ライブラリは本格的なフレームワークではなく、単なるプレゼンテーション層です。 アプリケーションを迅速にプロトタイピングするために個別に使用したり、他のライブラリと組み合わせてユーザーインターフェイスをカスタマイズしたりできます。



Vue.jsは、Angular、Knockout、React、Rivetsの影響を強く受けています。 類似性にもかかわらず、Vue.jsは、シンプルさと機能性の黄金比を求めて、これらの既存のライブラリに代わる価値のある選択肢を提供できます。









Vue.jsとAngular.jsの違いは何ですか?



AngularではなくVue.jsを使用する理由はいくつかありますが、すべてをすべてのプロジェクトに適用できるわけではありません。

  1. Vue.jsは柔軟性が高く、ソリューションが単純ではありません。 これにより、必要に応じてアプリケーションを構造化でき、Angularのようにこれらすべてを強制することはありません。 Vueはプレゼンテーションレイヤーにすぎないため、本格的なフレームワークの代わりに、アプリケーションページの控えめな機能として使用できます。 これにより、Vueを他のライブラリと組み合わせるためのオプションが増えますが、より多くのアーキテクチャソリューションも担当します。 そのため、たとえば、Vue.jsカーネルにはルーティングやajax関数がすぐに使用できるわけではなく、通常は外部モジュールを使用してアプリケーションを構築することを想定しています。 これがおそらく最も重要な違いです。
  2. Vue.jsは、APIと設計の両方の面で、Angularよりもはるかに単純です。 Vue.jsのほぼすべての側面を十分な速さで学習し、すぐに書き始めることができます。
  3. Vue.jsは「 ダーティチェック 」を使用しないため、パフォーマンスが向上します。 複数のオブザーバーを使用すると、角度が遅くなります。スコープを変更するたびに、これらすべてのオブザーバーを再計算する必要があるためです。 Vue.jsは透過的なオブザーバートラッキングシステムを使用しているため、この問題の影響を受けません。したがって、明示的に関連する依存関係がある場合、すべての変更は独立して呼び出されます。








Vue.jsとReact.jsの違いは何ですか?



  1. ReactとVue.jsは、どちらもリアクティブおよびコンポーザブルのコンポーネント表現をサポートするという点でほとんど類似性がありません。 ただし、内部実装は根本的に異なります。 Reactは仮想DOMに基づいています-メモリはDOMが実際にどのように見えるかを表します。 Reactのデータはほとんど変更されておらず、DOMの変更は差異の決定に基づいて計算されます。 一方、Vue.jsでは、データはデフォルトで変更可能であり、イベントを介して変更されます。 Vue.jsは、仮想DOMの代わりに、DOMをテンプレートとして直接使用し、既存のノードへのリンクをバインド用に保持します。
  2. 仮想DOMアプローチは、プレゼンテーションをいつでも説明する機能的な方法を提供します。これは非常に便利です。 オブザーバーパターンは使用されず、更新ごとにアプリケーション全体が再描画されないため、定義によるビューはデータと同期することを保証し、同型JavaScriptアプリケーションの機会も開きます。
  3. しかし、Reactの使用に関する問題は、ロジックとビューが密接に絡み合っていることです。 一部の開発者にとってはこれはプラスですが、デザイナー/ハイブリッド開発者にとっては、デザインとCSSでテンプレートを提示する方が明らかに簡単です。 JSXとJavascript-logicをマージすると、デザインにコードを表示するために必要な視覚モデルが壊れます。 対照的に、Vue.jsは軽量なディレクティブで成果を上げていますが、視覚的に表示されるテンプレートと、ディレクティブとフィルターにカプセル化されたロジックが常にあります。
  4. もう1つのReactの問題は、すべての更新が仮想DOMに委任されることです。これは、DOMを実際に自分で制御する必要がある場合は少し複雑です(理論的には可能ですが、必要に応じてライブラリとは対照的に作業する必要があります)。 複雑な同期時間アニメーションを必要とするアプリケーションの場合、これは非常に迷惑な制限になる可能性があります。 この点で、Vue.jsはより柔軟です。


ポリマー






Vue.jsとPolymerの違いは何ですか?



Polymerは、Vue.jsにも影響を与えたもう1つのGoogleスポンサープロジェクトです。 Vueコンポーネントは、カスタムのPolymer要素よりも疎結合の場合がありますが、どちらも同様のデザインスタイルを提供します。 最大の違いは、PolymerはWebコンポーネントの最新機能に基づいて構築されており、これらの最新機能をサポートしていないブラウザで動作するために重要なポリフィルが必要なことです(パフォーマンスが低下します)。 対照的に、Vue.jsはIE9まで依存関係なく動作します。



ノックアウト






Vue.jsとKnockoutJSの違いは何ですか?



第1に、VueはVMプロパティのゲッターとセッターのよりクリーンな構文を提供します。



より高いレベルでは、Vueデータはシンプルで論理的なオブジェクト(JSON.stringifyを直接使用してリクエスト後に転送できるなど)であり、ViewModelはこのデータにアクセスするためのインターフェイスを提供するだけであるという点で、VueはKnockoutとは異なります。 Vue VMインスタンスは、常にソースデータを対応するDOM要素にバインドします。 Knockoutでは、ViewModelは基本的にデータであり、モデルとViewModelの間の線はかなりぼやけています。 Knockoutでの分離の欠如は、混乱するViewModelにつながる可能性があります。






単独で-Vue.jsライブラリを使用しても万能薬にはなりませ 。 このライブラリにはボトルネックと重要なソリューションもありますが、インタラクティブなユーザーインターフェイスを開発する場合、Vueは間違いなく注目に値します。

インターネット上のこのライブラリには英語のトレーニング資料が非常に多くありますが、「正直なMVVM」をマスターするためのロシア語のレッスンもあります: ausite.ru



All Articles