Einleitung
Dieser nette kleine (vielleicht etwas voreingenommene) Artikel vergleicht zwei der beliebtesten JavaScript-Frameworks: Angular und Vue. Ich werde versuchen, einen kurzen Überblick über die Geschichte, die Syntax, die Struktur und die Popularität der beiden Frameworks zu geben. Ich werde auch versuchen, Ihnen einen kurzen Überblick über die Vor- und Nachteile beider Frameworks zu geben. Die Grundlage dieses Textes bilden verschiedene vergleichende Artikel, die ich online zu diesem Thema finden konnte, sowie meine eigene Erfahrung mit den jeweiligen Frameworks. Ich wünsche Ihnen viel Spaß beim Lesen.
Geschichte
Angular, entwickelt von Google, wurde erstmals 2010 veröffentlicht und ist damit das älteste aller Frameworks. Es handelt sich um ein TypeScript-basiertes JavaScript-Framework. Mit der Veröffentlichung von Angular 2 (und dem Wegfall des „JS“ aus dem ursprünglichen Namen – AngularJS) kam es 2016 zu einer grundlegenden Änderung. Angular 2+ ist jetzt nur noch als Angular bekannt. Obwohl AngularJS (Version 1) immer noch aktualisiert wird, werden wir uns in dieser Diskussion auf Angular konzentrieren.
Vue, auch bekannt als Vue.js, ist das neueste Mitglied der Gruppe. Es wurde von dem ehemaligen Google-Mitarbeiter Evan You im Jahr 2014 entwickelt. In den letzten Jahren hat Vue stark an Popularität gewonnen, obwohl es von keinem großen Unternehmen unterstützt wird. Die neueste Version wird immer auf der offiziellen Vue-Website auf der Seite „Releases“ angekündigt. Wer zu Vue beiträgt, wird durch Patreon unterstützt. Es sollte angemerkt werden, dass Vue auch sein eigenes GitHub Repo hat und mit TypeScript arbeitet. Vue wird u.a. vom Laravel-Projekt, GitLab und snyk unterstützt.
Lernkurve
Vue ist einfacher zu erlernen, besonders wenn man von React oder Angular umsteigt. Vue.js verwendet reines JavaScript, und die Templates in Vue.js sind in HTML geschrieben. Daher gibt es für Vue-Entwickler und -Ingenieure keine Notwendigkeit, eine andere Programmiersprache als JavaScript zu lernen.
Wenn Sie JavaScript gut genug beherrschen, können Sie mit Hilfe des Handbuchs innerhalb eines Tages mit Vue arbeiten.
Angular hingegen ist komplex und hat eine steile Lernkurve. Um Angular zu verwenden, müssen Sie zunächst andere Konzepte wie TypeScript und MVC (Model View Controller) verstehen. Daher ist es für Anfänger sehr schwer zu erlernen.
Selbst nach Jahren der Arbeit mit Angular kann es schwierig sein, es vollständig zu verstehen. Es ist eine Nische für erfahrene Benutzer und Entwickler.
- Gewinner – Vue
Popularität
Angular wird von einer großen Community unterstützt, die seit der ersten Veröffentlichung von Angular stetig wächst. Es wird etwa 500.000 Mal pro Woche heruntergeladen und hat mehr als 70.000 Sterne auf GitHub.
Aus der Sicht eines Jobs hat Angular einen größeren Markt. Die meisten großen Unternehmen bevorzugen Angular wegen der einfachen Entwicklung und Handhabung großer, komplizierter Webanwendungen. Als Angular-Webentwicklungsunternehmen verwenden einige das Angular-Framework, um Web-Lösungen auf Unternehmensebene zu entwickeln.
Die große Beliebtheit von Angular bedeutet auch, dass Sie verschiedene Lösungen von verschiedenen Anwendern erhalten können. Sie können auch Unterstützung von erfahrenen Entwicklern erhalten, ohne den langwierigen Prozess des technischen Supports durchlaufen zu müssen.
Vue ist eine wachsende Gemeinschaft. Obwohl es sich schnell zu einem beliebten Framework entwickelt hat, ist der Markt im Vergleich zu React oder Angular noch klein.
Es wird noch ein paar Jahre dauern, bis Vue genügend Arbeitsplätze geschaffen hat. Vue stützt sich hauptsächlich auf die Open-Source-Community, aber der Wissensaustausch ist im Vergleich zu Angular nicht so weit fortgeschritten.
- Gewinner – Angular
Vue
Vue ist eine kleinere, leichtgewichtige Version von Angular. Es verwendet Elemente und Anwendungen von Drittanbietern, um viele benötigte Features und Funktionalitäten zu integrieren. Sie müssen auch andere Bibliotheken von Drittanbietern hinzufügen, da es nur sehr wenige eingebaute Kernbibliotheken in Vue gibt.
Dies reduziert sowohl die Größe als auch die Komplexität des Codes und macht ihn einfacher zu bedienen und zu navigieren. Die neuere Version von Vue ist im Vergleich zu anderen bestehenden Frameworks kleiner und schneller.
Der Unterschied zu Angular besteht darin, dass es viel mehr eingebaute Funktionen und Bibliotheken gibt. Dies macht Angular zu einem monolithischen Framework, das viel Speicherplatz benötigt. Obwohl viele dieser Elemente sehr nützlich und notwendig sind, werden andere höchstwahrscheinlich nie verwendet.
Dies führt zu einer Menge unnötiger Komplexität.
- Gewinner – Vue
Syntax und Komplexität
Vue ist extrem einfach zu benutzen und zu erlernen. Die Syntax ist leicht zu verstehen und der Code Ihrer Vue-Anwendung wird ordentlich, kurz und sauber sein.
Wie bereits erwähnt, ist Angular wesentlich komplexer in der Anwendung als Vue. Aufgrund der starren strukturellen Regeln erfordert die Durchführung einfacher Aktionen auch lange Codezeilen. Auch die Syntax einer Angular-Anwendung ist im Vergleich zu Vue sehr viel komplexer.
- Gewinner – Vue
Struktur und Flexibilität
Vue ist nicht sehr strukturiert und bietet dem Entwickler daher eine große Flexibilität. Es bietet offizielle Unterstützung für zahlreiche Build-Systeme, was Ihnen die Flexibilität gibt, Ihre Anwendung so zu gestalten, wie Sie es für richtig halten. Es gibt keinen einzigen Weg, die Anwendung zu strukturieren. Sie können eine HTML- oder JavaScript-Datei verwenden, um Ihre Vorlagen zu schreiben.
Angular hingegen hat eine viel stärker definierte Anwendungsarchitektur. Dies ist vor allem bei der Entwicklung großer Anwendungen hilfreich. Viele große Unternehmen bevorzugen Angular gegenüber anderen Frameworks, weil es allen Entwicklern eine Standardarchitektur zur Verfügung stellt.
Je nachdem, welche Art von Entwickler/Team Sie sind, sollten Sie abwägen, was für Sie besser ist – Flexibilität oder Struktur.
- Gewinner – Unentschieden
Daten-Rendering
Vue.js verwendet virtuelle DOMs, eine vereinfachte Kopie des DOMs. Unter Verwendung des virtuellen DOMs sortiert das Framework eine leistungsoptimierte Standardkonfiguration aus. Wenn sich also die Anwendungsdaten ändern, wird das virtuelle DOM anstelle der Benutzeroberflächen gerendert.
Dies führt zu einer drastischen Verbesserung der Laufzeit und Ladezeit der Anwendung. Außerdem ist es viel effizienter, die Ansichten mithilfe des virtuellen DOM zu aktualisieren.
Angular verwendet im Gegensatz zu anderen Frameworks keine virtuellen DOMs. Stattdessen werden Watcher verwendet, um den Datenrendering-Prozess zu vereinfachen. Watchers behalten alte Datenwerte im Auge und aktualisieren nur die Teile des ursprünglichen DOM, deren Werte sich geändert haben.
- Gewinner – Unentschieden
TypeScript
Da Angular ein TypeScript-basiertes JavaScript-Framework ist, sind alle Ressourcen und Dokumentationen in TypeScript geschrieben.
Sogar das Framework selbst ist in TypeScript geschrieben, was reichlich Gelegenheit bietet, den Code innerhalb einer klar definierten Struktur zu steuern. Dies ist ein zusätzlicher Vorteil, vor allem wenn Sie umfangreiche Anwendungen erstellen.
Die neue Version von Vue.js ist ebenfalls eine 100%ige Neuschreibung in TypeScript. Vue3 bietet vollen Support und dank seiner Struktur eine klarere Grundlage für Projekte aller Art.
- Gewinner – Vue
MVC/MV VM
Angular verwendet das MVC-Framework (Model-View-Controller). Das bedeutet, dass die Anwendung grob in drei logische Teile unterteilt ist: das Modell, die Ansicht und der Controller.
Dadurch wird die Anwendung in verschiedene Komponenten aufgeteilt, wobei die Benutzeroberflächenschicht von der Anwendungslogikschicht getrennt bleibt. Mit Angular können Entwickler gut strukturierten Code schreiben und längeren Code in Abschnitte unterteilen. Dies ist eine hervorragende Hilfe bei der Entwicklung großer, komplexer Webanwendungen mit mehreren Seiten.
Vue.js verwendet das MV-VM-Modell (Model-View-View-Modell) des JavaScript-Frameworks. Die Modellschicht enthält die Logik hinter der Anwendung, während die Ansichtsschicht die Logik der Benutzeroberfläche enthält. In der View-Model-Schicht interagieren die View- und die Model-Schicht miteinander und tauschen Daten aus.
Dadurch entsteht eine bidirektionale Datenbindung, d. h. ein bidirektionaler Datenfluss innerhalb von Vue-Anwendungen.
Es ist einfacher, die HTML-Blöcke im MV VM-Modell zu handhaben. Es ist auch einfacher für Vue-Entwickler, Units im MV VM-Modell zu testen. Aber im Vergleich dazu arbeiten die Blöcke im MVC-Framework effizienter zusammen.
- Gewinner – Unentschieden
Fazit
In den meisten Fällen würden Sie sich wahrscheinlich nicht allein zwischen Angular und Vue entscheiden. Es handelt sich um völlig unterschiedliche Bibliotheken mit sehr unterschiedlichen Funktionen und Lernkurven. Vue ist die klare Wahl für weniger erfahrene Entwickler, und Angular ist für diejenigen zu bevorzugen, die an größeren Anwendungen (auf Unternehmensebene) arbeiten.
Eine große Bibliothek wie Angular erfordert mehr Sorgfalt, wenn es darum geht, auf dem neuesten Stand zu bleiben, während Vue in dieser Hinsicht weniger anspruchsvoll ist, und die Tatsache, dass die beiden neuesten Hauptversionen von Vue in separaten Repositories sind, hilft dabei.
Es sollte auch beachtet werden, dass Vue von einem Entwickler entwickelt wurde, der früher für Google an Angular gearbeitet hat, also ist das eine weitere Sache, die man im Hinterkopf behalten sollte, obwohl das keinen großen Einfluss auf Ihre Entscheidung haben würde.