JavaScript-Bibliothek Vue.js: React-Konkurrent erscheint in Version 2.0

Zentrale Neuerung von Vue.js 2.0 ist ein Redone-Rendering-Layer, durch den sich mit der JavaScript-Bibliothek erstellte Anwendungen besser verhalten sollen.

In Pocket speichern vorlesen Druckansicht 88 Kommentare lesen
Vue.js: React-Konkurrent erscheint in Version 2.0
Lesezeit: 2 Min.
Von
  • Rainald Menge-Sonnentag
  • Alexander Neumann

Die Entwickler von Vue.js haben kürzlich die Version 2.0 der JavaScript-Bibliothek freigegeben. Im Fokus des neuen Release stehen die Einführung einer Redone-Rendering-Schicht, die für eine besser Performance sorgen soll, und die Ausrichtung auf die Entwicklung mobiler Apps.

Die neue Rendering-Schicht basiert auf einer schlichten virtuellen DOM-Implementierung, die wiederum ein Fork der snabbdom-Bibliothek darstellt. Zusätzlich ist der Template-Compiler von Vue.js in der Lage, einige effektive Optimierungen während der Kompilierung durchzuführen – beispielsweise das Analysieren und Hosten statischer untergeordneter Bäume.

Die Template-Syntax von Vue.js 2.0 bleibt bei alledem weitgehend kompatibel mit der ersten Generation, einige kleinere Deprecations ausgenommen. Die Entwickler haben für alle Fälle eine Migrationsanleitung präpariert und ein Befehlszeilenhilfswerkzeug bereitgestellt. An die Version 2.0 angepasst wurden letztlich die Bibliothek begleitedende Werkzeuge wie vue-router, vuex, vue-loader und vueify.

Mit Vue.js sollen sich reaktive Webanwendungen leicht erstellen lassen. Sie konkurriert hier etwa mit Facebooks React-Bibliothek. Die Verbindung zwischen den sichtbaren Elementen und der Datenschicht verwaltet das System selbstständig. Die Bibliothek erkennt Abhängigkeiten, wenn Funktionen den Inhalt von Web Components bestimmen, und reagiert bei Änderungen innerhalb der verwendeten Variablen ebenso automatisch. Das Herzstück der Bibliothek sind Komponenten, die komplexere Strukturen abbilden. Wie bei anderen Systemen können sie weitere Komponenten enthalten. Die Eltern bestimmen dabei Eigenschaften der Kinder, die Kommunikation zwischen allen Elementen findet über ein Event-System statt.

Vue.js will mit Animationen punkten: Sobald neue Elemente zum DOM (Document Object Model) hinzukommen, kümmert sich Vue.js um die CSS-Transitions, die für Effekte wie das Ein- und Ausblenden verantwortlich sind. Entwickler steuern die Übergänge über ein transition-Schlüsselwort. Die Besonderheit gegenüber React und Angular ist offenbar, dass die Bibliothek die betroffenen Elemente kennt und daher nicht den gesamten Baum mit allen Kindern neue berechnen und rendern muss.

Im Vergleich zu React wird zum Beispiel hervorgehoben, dass Letzteres ein virtuelles DOM verwendet, während Vue das tatsächliche anspricht. Das virtuelle Modell sei jedoch entgegen der landläufigen Meinung nicht schneller, sondern langsamer und bringe eine zusätzliche Komplexität mit sich. (ane)