Jeden Tag wird JavaScript mehr und mehr verwendet.
War es früher nur für die Erstellung des Client-Teils der Webanwendung geeignet, bietet es heute auch großartige Möglichkeiten für die Backend-Entwicklung.
Modernes JS eignet sich auch für Anwendungen, die für die Verarbeitung großer Datenmengen konzipiert sind, da es eine Vielzahl von Tools bietet und einen klaren und präzisen Code schreiben kann. Sind Sie immer noch nicht überzeugt?
In der Tat bietet JavaScript eine Vielzahl von Instrumenten zum schnellen Suchen, Lesen, Erstellen, Bearbeiten, Löschen und Filtern verschiedener Datentypen:
- integrierte CRUD-Operationen
- Operationen zur Speicherverwaltung
- Map, Filter und Reduce in funktionalem JS.
Auf der anderen Seite ist es verständlich, dass „reines“ JavaScript nicht viel Flexibilität zulässt. Um mit seiner Hilfe etwas Brauchbares zu erstellen (vor allem wenn es um die Verarbeitung großer Datenmengen geht), benötigen Sie ein Framework.
Wir haben die drei beliebtesten JS-Frameworks (oder besser gesagt, zwei Frameworks und eine Bibliothek) zum Vergleich ausgewählt: Angular.js, Vue.js und React.js.
Dieses Trio hat im letzten Jahr die meisten Sterne auf Github erhalten, wie aus den Statistiken von RisingStarshervorgeht .
Das Überraschendste in diesem Fall ist, dass der Spitzenreiter das sehr junge Vue.js war, das bis Mitte 2016 nur in der chinesischen Muttersprache des Entwicklers verfügbar war. Seine schnelle Verbreitung ist ein Indikator für seinen Erfolg.
Versuchen wir nun zu verstehen, welche dieser Softwarelösungen es wert ist, bei der Erstellung von Datenverarbeitungssoftware beachtet zu werden.
React vs Angular vs Vue: 5 repräsentative Runden
Um eine möglichst objektive Bewertung dieser drei Produkte zu erhalten, haben wir beschlossen, jedes von ihnen anhand von fünf Kriterien zu analysieren, die für die Erstellung von Datenverarbeitungssoftware grundlegend sind.
Diese sind die folgenden:
Runde 1: Grundsätze der Interaktion mit DOM
Das Hauptwerkzeug zur Durchführung dynamischer Änderungen innerhalb eines Hypertext-Dokuments (XML/HTML) ist die DOM-Manipulation (Document Object Model).
Auf modernen Webressourcen können solche Modelle Hunderte von Knoten haben, was sich leider negativ auf die Geschwindigkeit der erstellten Webanwendungen auswirken kann. Lassen Sie uns herausfinden, welche Methoden der Arbeit mit DOM von jeder der untersuchten Lösungen gewählt werden.
Wir beginnen mit der React-Analyse. Die Funktionsweise von React.js basiert auf einem virtuellen DOM – einer „leichtgewichtigen Kopie“ eines realen DOMs. Um zu prüfen, welche Knoten „neu gezeichnet“ werden müssen, vergleichen React-basierte Anwendungen zwei DOM-Bäume (von denen einer virtuell ist), und das Rendering selbst beginnt nur bei den Knoten, die geändert werden müssen.
Dieser Ansatz verbessert die Leistung der Software auf der Client-Seite. In einigen Fällen. ist React nicht so einfach anzuwenden, z. B. wenn eine Animation mit komplexer Zeitsynchronisation erstellt wird, da alle Operationen mit dem DOM manuell kodiert werden müssen.
Was Vue betrifft, so sind hier alle Daten an Ereignisse „gebunden“ und werden synchron aktualisiert. In der Tat, Vue verwendet auch Virtual DOM wie React, aber tut es mit ein wenig mehr filigran, Betrieb der Referenzen auf jeden Knoten des Baumes.
Aus diesem Grund wählen viele Entwickler dieses Framework für Anwendungen, die kapazitiv sind (im Sinne von Animation und Interaktivität).
Und zum Schluss noch ein paar Worte zu Angular 5 (der neuesten Version). Dieses Framework arbeitet zwar mit Real DOM, tut dies aber indirekt über Abstraktionen – Renderer2, TemplateRef, ElementRef und ViewContainerRef– sowie über Direktiven, die die Erstellung dynamischer Inhalte vereinfachen: ngTemplateOutlet und ngComponentOutlet.
Neue Entwickler brauchen viel Zeit, um die Prinzipien der Bedienung des DOM zu beherrschen. Daher sind wir der Meinung, dass Vue das beste Verhältnis von Zeit und Effizienz aufweist.
Runde 2: Leistung
Lassen Sie uns nun die Performance analysieren – eines der meistgefragten, aber auch umstrittenen Kriterien für den Vergleich von JS-Frameworks.
Wie Sie anhand der analytischen Indikatorenbeurteilen können , erstellen React und Vue effiziente Softwarelösungen.
Außerdem testen die React-Entwickler derzeit React Fiber – einen neuen Kernalgorithmus, der die visuelle Darstellung deutlich reaktionsschneller machen würde.
In dieser Runde verliert Angular 5 eindeutig, basierend auf den gleichen Daten aus dem oben genannten Test.
Daraus schließen wir, dass Anwendungen mit komplexer Geschäftslogik, die auf diesem Framework aufgebaut sind, wahrscheinlich kein schnelles, benutzerfreundliches System haben werden.
Runde 3: Anpassungsfähigkeit an die Teamarbeit
Was können wir über Bequemlichkeit sagen?
Lassen Sie uns darüber sprechen, inwieweit unsere Wettbewerber für Gruppenarbeit geeignet sind.
Wir werden mit React.js beginnen . Das Hauptproblem dieser Bibliothek ist die Tatsache, dass es keine Unterteilung in die Strukturen MVC (Model-View-Controller), MVW (Model-View-Whatever) oder MVVM (Model-View-ViewModel) gibt.
Ohne die Trennung von Anwendungslogik und -präsentation können mehrere Entwickler oder sogar Teams nicht gleichzeitig arbeiten, was wiederum den Entwicklungsprozess erheblich erschweren und zeitaufwändig machen kann.
Vue ist seinerseits ein MVC-Framework. Zusätzlich stellt es Entwicklern ein Template zur Verfügung, das in Form von Direktiven und Filtern dargestellt wird. Dies führt zu einem besser lesbaren Code und damit zu einer geringeren Fehlerwahrscheinlichkeit.
Was ist mit Angular? Dieses Framework war von Anfang an auf die Bequemlichkeit der Entwickler ausgelegt. Es basiert auf der MVW-Architektur und trennt die Anwendungslogik von ihrer Darstellung auf der Benutzeroberfläche. Das Ergebnis ist eine modulare Lösung, die mehrere Entwicklungsteams gleichzeitig und mit denselben Daten nutzen können.
Wenn Sie also auf eine extrem produktive Teaminteraktion Wert legen, kommt React vielleicht nicht in Frage. Ist also Vue oder Angular die beste Wahl?
Runde 4: Eintrittsschwelle
Lassen Sie uns nun die Eingangsschwelle für jeden der drei in diesem Artikel behandelten Rahmen definieren.
Obwohl React im Vergleich zu Angular als viel einfacher zu erlernen gilt, ist es wiederum schwieriger als Vue. Um Anwendungen mit React zu erstellen, benötigen Sie insbesondere Erfahrung mit JSX und ECMAScript2015 (und späteren Versionen).
Für Vue benötigen Sie nur JS, mit einer Neigung zur klassischen Webprogrammierung. Außerdem gilt Vue hinter den Kulissen als eine einfachere Version von Angular. Es ist genauso gut strukturiert, erfordert aber nicht so viel Einarbeitung. Tatsächlich ist Vue.js sowohl im HTML-zentrierten Ansatz als auch beim Schreiben des JavaScript-Codes einfach. In dieser Hinsicht ist es um ein Vielfaches besser als React.
Nun zu Angular. Dieses Framework bietet dank seiner bewährten Funktionen eine unglaubliche Menge an Funktionalität „out of the box“. Hier werden Sie nicht auf die Probleme stoßen, die mit React und Vue verbunden sind.
Beispielsweise benötigen Sie in 99 von 100 Fällen keine Bibliotheken von Drittanbietern. Obwohl Vue auch ein vollwertiges Framework ist, ist es noch jung genug und verfügt vielleicht nicht über die richtigen Werkzeuge oder nur in chinesischer Sprache über die richtigen Werkzeuge.
Beachten Sie auch, dass Sieaufgrund der Implementierung von TypeScript in Angular alte Projekte durch Refactoring von altem Code leicht aktualisieren können. In TS ist das sehr bequem und nimmt nur wenig Zeit in Anspruch.
Wie wir sehen können, gewinnt Vue im Kampf zwischen Angular 5, Vue und React eindeutig die vierte Runde.
Runde 5: Große Nachteile
Und nun – die ungewöhnlichste Runde.
Einige der Unzulänglichkeiten, die diesem oder jenem Rahmen innewohnen, können praktisch alle Vorteile zunichte machen.
Aus Gründen der Objektivität haben wir daher beschlossen, eine Reihe von Unzulänglichkeiten hervorzuheben, die den überprüften Frameworks – React, Angular und Vue – eigen sind.
Beginnen wir mit React. In der Tat hat es nur einen wesentlichen Nachteil.
Bei React handelt es sich nicht um ein vollständiges Framework, sondern um eine Bibliothek. Wenn Sie also versuchen, bei der Erstellung des Projekts möglichst kurze Fristen einzuhalten, ist React möglicherweise nicht die beste Wahl, um fortgeschrittene Funktionen zu erstellen, da Sie die Hilfe von Drittanbieter-Tools benötigen.
Und wenn Sie die erstellte Software aktualisieren wollen, dann kann es sein, dass eines dieser Tools zum Zeitpunkt der Aktualisierung bereits veraltet oder veraltet ist. Sie müssen dann einen Ersatz finden, was Ressourcen kostet.
Nun ein paar Worte zu Vue.js. Zunächst einmal ist die größte Vue-Community chinesisch.
Seien Sie also darauf vorbereitet, nach Lösungen für Ihre Probleme zu suchen, wenn Sie selbst in Vue programmieren.
Zweitens hat dieses Framework ärgerliche Laufzeitfehler in den Templates – ein Ausgleich für die Bequemlichkeit der Nutzung (das Gleiche galt für Angular 1). Schließlich ist die Infrastruktur des Frameworks recht neu und es gibt nur wenige von der Community erstellte Komponenten.
Dennoch müssen wir anmerken, dass Entwickler in den meisten Fällen dank der umfangreichen eingebauten Funktionen kaum Tools von Drittanbietern verwenden müssen.
Abschließend noch ein paar Worte zu Angular. Zu den Unzulänglichkeiten gehören eine recht hohe Einstiegshürde mit der Notwendigkeit, TypeScript zu erlernen, und einige Schwierigkeiten, die beim serverbasierten Templating aufgrund der Trennung von JS-Code und HTML-Rendering auftreten können.
Welcher der oben genannten Mängel der wichtigste ist, bleibt Ihnen überlassen.
Denn vielleicht finden Sie es schwierig, TypeScript zu beherrschen, aber glauben, dass wenig bis kein englischsprachiger Support bei der Arbeit mit Vue ein noch größeres Manko ist.
Lesen Sie auch: React vs Vue Vergleich
Angular vs. React vs. Vue: Wie man das richtige Framework wählt
Wie Sie sehen können, ist jeder der oben genannten Kandidaten in irgendetwas gut.
Angular ist die beste Wahl für große Projekte, React ist ideal für diejenigen, die sich nicht auf irgendwelche Frames beschränken wollen, und Vue ist eine Art „Kompromiss“ zwischen diesen beiden Lösungen und wird oft für die Arbeit in kleinen Teams gewählt. Unserer Meinung nach gibt es hier keinen Gewinner.
Die Entscheidung sollte daher nach den persönlichen Vorlieben und Anforderungen eines bestimmten Projekts getroffen werden.
Wenn Sie eine Idee für eine Anwendung haben, die große Mengen heterogener Daten verarbeitet, Sie aber nicht wissen, mit welchen Werkzeugen Sie sie erstellen können, empfehlen wir Ihnen, sich von Fachleuten beraten zu lassen.
Wir nehmen uns gerne Ihres Projekts an und erstellen ein Ergebnis mit effizienter Software, die für eine spätere Skalierung vollständig angepasst und um die neue Funktionalität ergänzt wird.
