react!

react ist eine spezielle JavaScript Softwarebibliothek, die ein Grundgerüst für die Ausgabe von User-Interface-Komponenten von Webseiten zur Verfügung stellt. Die Technik wurde ursprünglich von FACEBOOK entwickelt, der Konzern ist auch immer noch in Wartung und Erweiterung involviert. Eine Datenabfrage findet jedoch ausdrücklich nicht statt.

Entscheidend für den Erfolg von react ist der hierarchische Aufbau. Die Syntax wird als eine Reihe selbst definierter HTML-Tags repräsentiert. Aufgrund dieser Anordnung sowie weiterer Faktoren wie dem unidirektionalen Datenfluss und Virtual DOM gelingt react ein performanter Aufbau auch komplexerer Anwendungen. So können nicht nur Onepager-WEBSITES erstellt werden, sondern auch größere Projekte relativ einfach gestemmt werden.

Technische Besonderheiten

• Unidirektionaler Datenfluss:

Die Wechselwirkung zwischen einzelnen Komponenten soll vereinfacht werden. Anders als im komplexen Event Handling erhält eine Komponente Daten nur über statische Eigenschaften und kann diese nicht selbstständig abändern. Eine Beeinflussung ist nur durch übergebende Callback-Funktionen möglich.

• Virtual DOM:

Der Virtual DOM verhindert, dass die Änderungen des Anwendungsbaums innerhalb des DOM, also des Document Object Models ablaufen, was extrem performanceintensiv ist. Ein Virtual DOM vergleicht die Anpassungen mit dem tatsächlichen DOM und aktualisiert nur die tatsächlichen Änderungen, so dass der Anwendungsbaum im DOM nicht komplett neu aufgebaut werden muss.

• JavaScript Syntax Extension:

JSX ist stark an der Template-Sprache XML angelehnt. Diese Sprache ermöglicht den Einbau von JavaScript, HTML und CSS in eine react -Komponente. Dadurch können diese Elemente modular in alle Web-Applikationen eingesetzt werden. react wird dadurch noch individueller.

Um die bessere Wartbarkeit und Skalierbarkeit von Applikationen zu gewährleisten, wird react zudem häufig mit Redux kombiniert. Redux ist ein Container für JavaScript Applikationen, der durch drei miteinander kombinierte Eigenschaften das Monitoring von react-Einträgen vereinfacht. Durch die Kombination mit Redux wir die komplette Applikation nur in einem einzigen Objektbaum angezeigt. Um den Status des Baumes zu ändern, muss zwingend ein beschreibendes Objekt hinzugefügt werden. So kann in der Dokumentation jede Änderung nachvollzogen werden. Die Spezifikationen, wie sich die Änderungen auf die Applikation auswirken sollen, werden mittels Reducer eingetragen.

Durch diese Faktoren und der zusätzlichen Möglichkeit des isomorphen Renderings sowohl auf dem Client als auch auf dem Server ist react aktuell eines der besten und stabilsten Frameworks. Die Performance wird erhöht, überflüssiger Code wird eingespart, der Aufwand ist geringer und der Ertrag höher.

Speziell WEBAGENTUREN können Projekte damit schneller und effizienter lösen. Kannte vor react nur der jeweilige Entwickler die besonderen Eigenheiten am Code, können nun alle am Projekt beteiligten Mitarbeiter alle Änderungen einsehen, nachvollziehen und verbessern.

Fazit

react ist zwar schon einige Jahre auf dem Markt, aber erst seit kurzer Zeit durch einige Anpassungen auch für größere Webprojekte interessant. Die zahlreichen Vorteile auf Entwicklerseite sorgen dafür, dass es speziell in Webagenturen sehr häufig verwendet wird. Der Kunde profitiert dabei von der schnelleren und wirtschaftlicheren Lösung.