Vor- und Nachteile der drei MVVM-Frameworks: Vue, Angular und Avalon_Others

Der Hauptinhalt dieses Artikels wird unter Bezugnahme auf die offizielle Dokumentation zusammengefasst:

Vue.js

Vue.js @You Yuxi ist eine Bibliothek zum Erstellen interaktiver Webschnittstellen. Es handelt sich um eine optimierte MVVM. Aus technischer Sicht konzentriert sich Vue.js auf die ViewModel-Schicht von MVVM-Modellen. Es verbindet die Ansichtsebene und die Modellebene durch bidirektionale Datenbindung. Die eigentliche DOM-Kapselung und das Ausgabeformat werden in Direktiven und Filter abstrahiert. Im Vergleich zu anderen Bibliotheken ist Vue.js eine kleine, aber feine Bibliothek. Der Hauptzweck des Autors besteht darin, reflektierende Datenbindungs- und zusammensetzbare Ansichtskomponenten über eine möglichst einfache API zu erstellen.

Vorteile:

Einfach: Die offizielle Dokumentation ist sehr klar und einfacher zu erlernen als Angular.
Schnell: DOM im asynchronen Batch-Modus aktualisieren.
Zusammensetzung: Stellen Sie Ihre Anwendung mit entkoppelten, wiederverwendbaren Komponenten zusammen.
Kompakt: ~18 KB min+gzip und keine Abhängigkeiten.
Leistungsstark: Ausdrücke und berechnete Eigenschaften ohne Deklaration von Abhängigkeiten.
Modulfreundlich: Es kann über NPM, Bower oder Duo installiert werden. Es zwingt nicht Ihren gesamten Code, den verschiedenen Vorschriften von Angular zu folgen, und die Verwendungsszenarien sind flexibler.

Nachteile:

Neugeboren: Vue.js ist ein neues Projekt, Version 0.10.0 Release Candidate, veröffentlicht am 20. März 2014. Die neueste Version auf Github ist Version 0.11.4, die nicht so ausgereift ist wie Angular.
Die Auswirkungen sind nicht sehr groß: Ich habe gegoogelt und festgestellt, dass die Vielfalt bzw. der Reichtum von Vue.js geringer ist als die einiger anderer bekannter Bibliotheken.
Unterstützt IE8 nicht: Haha, aber AngularJS 1.3 hat auch die Unterstützung für IE8 aufgegeben, aber der Avalon von Lehrer @ Stu Zhengmei unterstützt IE6+, daher sollten große Anstrengungen unternommen werden, um ihn zu optimieren. Dies ist nicht gut für Projekte, die IE8 unterstützen müssen, aber dies ist auch ein Trend in der Web-Front-End-Entwicklung. Niedrigere Versionen von IE sollten sich aus der Phase der Geschichte zurückziehen, anstatt sich an diese anzupassen die ältere Versionen verwenden. Personen, die kein Upgrade durchführen. Lehrer @玉博 hat etwas gesagt, und ich finde es sehr gut. „Heutzutage ist die Unterstützung von IE6 und 7 keine Funktion mehr, aber eine Schande. Wir arbeiten hart daran, Alipay so zu fördern, dass es IE6 und 7 nicht mehr unterstützt. Wir freuen uns.“ dass sich noch mehr Brüder uns anschließen.

AngularJS

AngularJS erfreut sich in letzter Zeit großer Beliebtheit und hat viele Follower. Superheldenhaftes JavaScript MVW Framework
Die offizielle Aussage ist sehr einfach: „Clientseitige Technologie, die vollständig in JavaScript geschrieben ist. Wird in Verbindung mit anderen seit langem etablierten Webtechnologien (HTML, CSS und JavaScript) verwendet, um die Entwicklung von Webanwendungen einfacher und schneller als je zuvor zu machen.“ Wenn Sie es lernen, werden Sie meiner Meinung nach von den vielen neuen Spezialeffekten angezogen werden.

Vorteile:

Dynamische Ansicht: Ich hätte nie gedacht, dass js die Attribute von HTML auf diese Weise erweitern kann, aber AngularJs hat es geschafft. Es fügt unserem statischen HTML viele Erweiterbarkeitsfunktionen hinzu und es fühlt sich an, als würde es HTML zum Leben erwecken.
Perfekt: Es handelt sich um ein relativ vollständiges Front-End-MVW-Framework, einschließlich Vorlagen, bidirektionaler Datenbindung, Routing, Modularisierung, Diensten, Abhängigkeitsinjektion und anderen Funktionen. Die Vorlagen sind leistungsstark und umfangreich, deklarativ und verfügen über eine Fülle von Angular Anweisungen. .
Google-Wartung: AngularJS wird von Google verwaltet. Es hat offensichtliche Vorteile gegenüber Vue.js und Avalon. Die Community ist auch sehr aktiv und kann seine Entwicklung gut vorantreiben.
AngularJS & Ionic: Ionic: Advanced HTML5 Hybrid Mobile App Framework, diese beiden sind gute Freunde. Ionic verwendet AngularJS, um ein Framework zu erstellen, das sich am besten für die Entwicklung umfangreicher und leistungsstarker Anwendungen eignet. Letztes Mal beantwortete Yu Zhihu eine verwandte Frage zur Webapp-Entwicklung. Welches Framework und welche Paket-App-Plattform bieten die beste Leistung und Effizienz? - Die Antwort von Tang Wei, Einzelheiten finden Sie hier.

Nachteile:

Groß und umfassend: Für mich ist die Lernkurve sehr mühsam und schwer zu verstehen.
Umdrehen und neu schreiben: Vor einiger Zeit habe ich die Community besucht und festgestellt, dass AngularJS 2.0 die beiden Frameworks umschreiben wird. Es handelt sich im Grunde genommen um zwei Frameworks kommt heraus, aber ich habe auch gesagt: Komm zurück, /article/79637.htmDieser Artikel erklärt die Änderungen in AngularJS2.0 sehr gut.
Es unterstützt IE8 oder niedriger nicht. Es scheint, dass 2.0 nur mobile Endgeräte unterstützt.

Avalon.js

Avalon.js ist ein einfaches und benutzerfreundliches Mini-MVVM-Framework, das von @ Stu Zhengmei geschrieben wurde. Es wurde erstmals am 15. September 2012 veröffentlicht. Es wurde entwickelt, um das Problem verschiedener Ansichtspräsentationen für dieselbe Geschäftslogik zu lösen . Man sieht oft Lehrer, die für sein Avalon.js werben und viele Tutorials veröffentlichen, was den Menschen in China zweifellos große Erleichterung beim Erlernen von Avalon.js bietet.

Vorteile

Einfach zu verwenden, Bindung in HTML hinzufügen, ViewModel mit avalon.define in JS definieren, dann die Methode avalon.scan aufrufen, und es wird verschoben!
Kompatibel mit IE6 (andere MVVM-Frameworks, KnockoutJS(IE6), AngularJS(IE9), EmberJS(IE8), WinJS(IE9)) und avalon.mobile, das in neueren Browserversionen wie IE10 effizienter laufen kann
Keine Abhängigkeiten, weniger als 5000 Zeilen, weniger als 50 KiB nach der Komprimierung
Unterstützt Filterfunktionen im Pipe-Zeichenstil, um die formatierte Ausgabe zu erleichtern
Die Granularität der lokalen Aktualisierung wurde auf einen Textknoten, den Feature-Knoten
, verfeinert Der zu bedienende Knoten ist beim ersten Scan an die Ansichtsaktualisierungsfunktion gebunden und zwischengespeichert, sodass kein Platz für das Erscheinen des Selektors vorhanden ist.
Machen Sie DOM-Manipulationscode fast ausgestorben
Verwenden Sie einen CSS-ähnlichen überlappenden Abdeckungsmechanismus, damit jede ViewModel-Partition die Seite abwechselnd rendern kann
Wenn ein Knoten entfernt wird, wird die entsprechende Ansichtsaktualisierungsfunktion intelligent entladen, um Speicher zu sparen
Betriebsdaten bedeuten den Betrieb von DOM, und Vorgänge auf ViewModel werden mit View und Model synchronisiert
Wird mit einem AMD-Modul-Loader geliefert, sodass keine Integration mit anderen Loadern erforderlich ist.

Nachteile

1. Die Array-Filterung ist nicht so umfassend wie der Winkelfilter und kann nur für MS-Text und MS-HTML verwendet werden.

2. Es gibt kein englisches Dokument und die Veröffentlichung ist eingeschränkt

3. Der Skin von OniUI sieht nicht gut genug aus. Viele Leute sagen, dass sie mit boostrap zusammenarbeiten müssen, aber niemand in der Community hat die Initiative dazu ergriffen