JavaScript Comparison react, vue, angular

JavaScript Frameworks - vue.js

Profilbild von Mathias Rothärmel

Mathias Rothärmel
23. 07. 2020• min Lesezeit

Was ist ein JavaScript Framework

Ein Framework bildet das Grundgerüst einer Anweundung und legt einen groben Rahmen für den Entwicklungsprozess fest. Frameworks besitzen wiederum verschiedene Funktionen aus Bibliotheken, die wiederum erweitert werden können.
Frameworks gibt es sowohl für die serverseitige, als auch für clientseitige Programmierung.
Zu den bekannten serverseitigen JavaScript-Frameworks gehören Express.Js, Hapi.Js und Socket.io.
Auf der Client-Seite sind VUE.JS, REACT.JS und Angular.JS zu nennen. Im folgenden Artikel werden wir uns hauptsächlich mit den Client-Seite beschäftigen.

Für was benötigt man ein JavaScript-Framework

Einzelseiten-Webanwendung wird eine Webanwendung bezeichnet, die aus einem einzigen HTML-Dokument besteht und deren Inhalte dynamisch nachgeladen werden. Diese Art von Web-Architektur steht im Gegensatz zu klassischen Webanwendungen, die aus mehreren, untereinander verlinkten HTML-Dokumenten bestehen. Hierdurch wird allerdings die Grundlage geschaffen, eine Webanwendung in Form einer Rich-Client- bzw. Fat-Client-Verteilung zu entwickeln. Eine verstärkte clientseitige Ausführung der Webanwendung ermöglicht eine Reduzierung der Serverlast sowie die Umsetzung von selbstständigen Webclients, die beispielsweise eine Offline-Unterstützung anbieten.

Die bekanntesten JS-Framworks im Überblick

Angular.JS (*2010)

Angular.JS wurde im Jahr 2010 von Google entwickelt und wird von Google in ihren meisten User-Interfaces verwendet. Das Framework orientiert sich am MVC-Prinzip[1] (Model, View, Controller).

https://angular.io

React.JS (*2011)

React.JS wurde von Facebook für die eigene Plattform 2013 entwickelt. Jordan Walke, ein Softwareingenieur bei Facebook, entwickelt es 2011 erstmals für den Facebooks Newsfeed und später für die Plattform Instagram. Im Mai 2013 wrude es dann als Open-Source-Project weitergeführt.

https://reactjs.org

VUE.JS (*2014)

VUE.JS wurde 2014 von Evan You entwickelt. Das Framework basiert auf dem MVVM [2], welches ein Entwurfsmuster und eine Variante des Model-View-Controller-Musters (MVC) [1] ist. Die Besonderheit von VUE.JS ist der leichtgewichtige Ansatz und die Einfachheit im Aufbau.

https://vuejs.org

Downloadzahlen 2020

Das passende Framework

Als Einzelseiten-Webanwendung (englisch single-page application, kurz SPA) wird eine Webanwendung bezeichnet, die aus einem einzigen HTML-Dokument besteht. Die Besonderheit besteht darin, dass neue Inhalte, die vom Nutzer angefordert werden dynamisch nachgeladen werden. Diese Art von Web-Architektur steht im Gegensatz zu klassischen Webanwendungen, die aus mehreren, untereinander verlinkten HTML-Dokumenten bestehen.
Durch dynamsierung der Webseiten, die mittels AJAX (englisch Asynchronous JavaScript and XML) den Inhalt vom Server holt, wird außerdem die Serverlast reduziert, da nur ein Teilbereich der Webandwendung aktualiert wird.
Ein weiterer Vorteil ist das programmartige Nutzer-Erlebnis, welches besonders bei Online-Anwendungen wie Google Analytics, HubSpot oder Content-Management-System gefragt ist.

Die richtige Wahl für die erste eigene Anwendung

"Nicht schon wieder so ein JS-Framework" – Die Zeit des Internets ist leider auch sehr schnelllebig. Daher wird man gerade als Web-Entwickler:in tagtäglich überflutet mit Informationen über neue Biblioteken und Frameworks, die man als Basis für sein nächstes Projekt wählen könnte.
Dabei empfehlen wir jedem Backend-, Frontend- oder Fullstack-Entwickler ein solides Grundwissen über reinem JavaScript, HTML und CSS.
Zu den Web-Trends 2020 zählt unteranderem wieder vermehrt die Entwicklung von Web- und App-Anwendungen. Daher empfehlen wir sich auch ins Thema JS-Frameworks einzuarbeiten, sofern Sie dies noch nicht gemacht haben.

Leichter und schneller Einstieg mit VUE.JS

Alle Frameworks und deren Unterschiede zu kennen ist sicherlich ein Vorteil und kann bei der Entscheidgungsfindung fürs erste Projekt sehr helfen.
Oftmals entdeckt man die Vor- und Nachteile der jeweiligen Technologie erst während des Entwicklungsprozesses.

Zunächst soll gesagt sein, dass es grundsätzlich immer unterschiedliche Entwickler-Preferenzen gibt, die bei der Wahl einer Softwarearchitektur eine große Rolle spielen. Schlussendlich kommt es auch immer auf die größe des Projekts und vorallem auf die Erfahrung und Skills der Person an, die hinter der Tastatur sitzt.
Gerade für klein bis mittelgroße Web-Anwendungen könenn wir jedoch VUE.JS wärmstens empfehlen.

Stärken

  • Zählt zu den schnellsten Systemen
  • Einfacher und leichtgewichtiger Aufbau
  • HTML und JavaScript Kentnisse sind die Grundlage des Systems
  • Unterteilung einer Anwendung in .vue Files ermöglicht es auch große Projekte übersichtlich zu realisieren
  • Große Community und zustäzliche Bibliotheken erleichtern den Einstieg und die Weiterentwicklung Ihrer Anwendung

Schwächen

  • Der Datenaustausch zwischen den einzelnen VUE-Components kann gerade am Anfang eine Hürde darstellen und erfordert etwas Arbeit

Es kann losgehen.

Sollten Sie auf den Geschmack gekommen sein oder bereits in VUE entwickeln, haben wir für Sie hier noch eine interessante Dokumentation über den Gründer Evan You von VUE.js und außerdem ein Boilerplate als Basis für einen schnellen Start mit VUE.js.

VUE.js - Die Dokumentation


Fußnoten:

[ 1 ] MVC Muster: Beim MVC Prinzip handelt es sich um ein "software-design-pattern" welches unterteilt wird in ein Modell (= Daten-Struktur), in eine Ansicht (= einzelne Templates, welches für den Nutzer sichtbar ist) und dem Controller (= die Befehle, die der Nutzer über das Template ansteuert )
[ 2 ] MVVM (Model, View, Model-View) ist ein Entwurfsmuster und eine Variante des MVC Musters [1]. - Model: Datenzugriffsschicht für Inhalte, die dem Benutzer angezeigt werden und von ihm manipuliert werden. - View: Alle durch die grafische Benutzeroberfläche (GUI) angezeigten Elemente. - Enthält die UI-Logik (Model der View) und dient als Bindeglied zwischen View und obigem Model.

über den autor

Profilbild von Mathias Rothärmel

Mathias Rothärmel
Web-Entwickler