iX 7/2018
S. 80
Report
Webentwicklung
Aufmacherbild

JavaScript-Frameworks im Vergleich

Stein auf Stein

Zahlreiche JavaScript-Frameworks buhlen um die Gunst der Webentwickler. Wir werfen einen detaillierten Blick auf die drei derzeit angesagtesten: Angular, React und Vue.js.

In der JavaScript-Welt spricht man immer häufiger von „Framework Fatigue“: Der Markt wird so sehr mit Frameworks und den dahinterstehenden Technologien und Konzepten überflutet, dass Entwickler schnell den Überblick verlieren können. Dabei ist die Entscheidung für ein Framework wesentlich für eine Webanwendung, ein Wechsel des Frameworks während der Implementierung erfordert erheblichen Aufwand.

Dieser Artikel stellt die derzeit populärsten JavaScript-Frameworks, ihre Gemeinsamkeiten und Unterschiede sowie die jeweiligen Ansätze und Methoden vor. Lösungen für gängige Problemstellungen zeigen, wie sich die Arbeit mit Angular, React und Vue.js anfühlt.

Was angesagt ist

React und – mit deutlich geringerer absoluter Nutzung – Vue.js steigen derzeit in der Gunst der JavaScript-Entwickler (Abb. 1). Quelle: The State of JavaScript Frameworks (siehe ix.de/ix1807080)

Im Januar 2018 veröffentlichte Laurie Voss, Mitbegründer und COO von NPM Inc., eine Analyse der JavaScript-Frameworks anhand der Download-Zahlen der NPM Registry (siehe ix.de/ix1807080). Die Trendkurven in Abbildung 1 zeigen eine Metrik, die NPM als „share of the registry“ bezeichnet: die Anzahl der Downloads bereinigt um das Wachstum der Registry insgesamt. In dieser Metrik liegt React deutlich vorne.

Doch für die Auswahl eines Frameworks ist die absolute Popularität nicht alles. Ein weiterer Aspekt ist das Wachstum. Auch hier liegt React gut im Rennen, allerdings ist Vue.js in den letzten beiden Jahren ebenfalls beachtlich gewachsen.

Die verschiedenen Frameworks verfolgen unterschiedliche Ansätze und Philosophien. Je nach Anwendung gibt es unterschiedliche Anforderungen und so hängt die Wahl des „richtigen“ Frameworks auch von dem damit umzusetzenden Projekt und von den Vorlieben des Entwicklers ab.

Unterschiedliche Typen von Frameworks

JavaScript-Frameworks gibt es wie Sand am Meer, allerdings lassen sie sich recht gut in zwei Kategorien unterteilen. GUI-Frameworks enthalten sämtliche Bestandteile zur Umsetzung einer Applikation. Das umfasst sowohl Strukturelemente wie einen Modul-Loader und Hilfsfunktionen als auch vorgefertigte grafische Komponenten. Diese Art von Framework macht in der Regel strikte Vorgaben, was den Aufbau und die Struktur einer Applikation angeht. Bekannte Vertreter dieser Kategorie von JavaScript-Frameworks sind extJS, dojo oder OpenUI5.

Ihr großer Vorteil liegt darin, dass ein Entwickler unter den vorhandenen Standardkomponenten alles findet, was er braucht. Die mit den GUI-Elementen dieser Frameworks erzeugten Applikationen genügen den hohen Ansprüchen großer Unternehmen, vor allem, wenn es um die Präsentation großer Datenmengen in tabellarischer oder grafischer Form geht. Allerdings kann es schnell aufwendig werden, sobald es darum geht, das Standardlayout anzupassen.

Bei komponentenorientierten Frameworks wie Angular, Ember, React und Vue.js liegt der Schwerpunkt auf der Strukturierung einer Applikation über Komponenten. Der Grad der Freiheit, die ein Entwickler dabei genießt, variiert zwischen den einzelnen Vertretern. Das liegt vor allem an der zugrunde liegenden Philosophie.

Vue.js und React konzentrieren sich auf den View Layer einer Applikation und übernehmen das Templating und das Data Binding, also die Anzeige und Aktualisierung der Daten aus dem JavaScript-Code über ein Template. Zur Organisation der Geschäftslogik und Behandlung asynchroner Operationen ist man auf zusätzliche Bibliotheken angewiesen. Ember und Angular fassen den Ansatz deutlich weiter und stellen einem Entwickler außerdem einen Service- oder Model-Layer beispielsweise zur Kommunikation mit einem Webserver zur Verfügung. Auch die Navigation innerhalb einer Single-Page-Applikation ist Bestandteil dieser Frameworks.

Aktuell dominieren in der JavaScript-Community ganz klar die komponentenbasierten Frameworks. Dieser Artikel vergleicht die drei großen Vertreter dieser Kategorie: Angular, Vue.js und React.