Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Analyse

Darum lohnt sich React heute mehr denn je

(Bild: Shutterstock)

React befindet sich im Umbruch. Noch dieses Jahr soll eine komplett neue Version der Javascript-Bibliothek erscheinen. Was bietet React aktuell und wie hat sich die Bibliothek weiterentwickelt?

React ist aus dem persönlichen Projekt eines Facebook-Entwicklers entstanden und 2013 dann schließlich eigenständig und frei zugänglich geworden. Allerdings waren die ersten Reaktionen noch eher skeptisch, denn React ist anders als andere UI-Frameworks. Das zeigt schon die Selbstbeschreibung der Bibliothek, die React weder als MVC-Framework sieht, noch die Nutzung von Templates einarbeitet. Das Konzept ist natürlich ungewohnt und hat Zeit gebraucht, um zu überzeugen. Inzwischen ist es aber nicht mehr nur bei Facebook und Instagram im Einsatz, sondern auch bei der Khan Academy oder der New York Times.

Dass React so ein Erfolg geworden ist, liegt vor allem an der Flexibilität die Bibliothek: Anstatt ein festes Framework zu erstellen, arbeitet React mit Komponenten, die unabhängig voneinander arbeiten und so ein modulares User Interface ermöglichen. Auch die Aktualisierung von Inhalten erfolgt immer nur für das jeweilige Modul und ist daher sehr schnell. Das liegt daran, dass React serverseitig ein virtuelles DOM nutzt, mit dem es dann nur einzelne Elemente abgleicht. Sind diese anders, werden sie im tatsächlichen DOM angepasst, was natürlich weit schneller ist als das eigentliche DOM immer wieder neu aufzubauen.

React: Das hat sich seit der Einführung getan

Seit der Einführung von React hat sich einiges getan. Am auffälligsten ist sicher die Einführung von React Native, womit mobile Apps programmiert werden können. Wie schon bei React ist auch React Native dazu gedacht, mit Komponenten in anderen Sprachen kombiniert zu werden, um so die bestmögliche App zu schreiben. Auch das Testen vereinfacht React merklich, da die App nach einer Änderung nicht neu kompiliert werden muss, sondern die Aktualisierungen von React automatisch übernommen werden, was auch schon in der Desktop-Anwendung der Fall ist.

Aber auch die JS-Bibliothek React hat sich weiterentwickelt. Das bedeutet auch heute nicht, dass damit alleine eine Website hochgezogen werden kann, sehr wohl aber, dass es weit performanter geworden ist. Im Großen und Ganzen ist auch in Version 15.5 die wichtigste Überlegung noch die, wie eure Darstellung in Komponenten zu unterteilen ist und wie die Elemente aussehen, aus denen diese sich zusammensetzen. Ansonsten hat sich React immer mehr an das DOM angepasst. Funktionen wie die onKey-Events oder auch die Anpassung von Begrifflichkeiten wie ReactElement statt descriptor und ReactNode statt renderable helfen dabei, React logisch einzuordnen.

Auch neu und für Entwickler hilfreich ist das Fehlercode-System, das jedem Fehler eine eigene ID zuweist und dazu eine Datenbank mit allen notwendigen Informationen verlinkt. So sind diese Daten extern gelagert und der Zugriff auf die Informationen erleichtert. Zu Beginn war React eine extrem große Datenmenge, diese wurde – nicht zuletzt durch diesen Schritt – deutlich verkleinert.

Das Update auf Version 15 hat dann alle SVG-Elemente nutzbar gemacht, dazu ist auch null als Ausgabewert von Funktionen möglich. Das schließt sich an die Möglichkeit an, zu null zu rendern, was das Update 11.0 mitgebracht hat. Ähnlich wie das Übergehen von Leerzeichen und Linebreaks sind diese Änderungen zwar nicht unbedingt für jeden relevant, erhöhen aber in jedem Fall die Usability, weil sich React auf diese Weise an andere Bibliotheken annähert und so die Arbeit für Programmierer erleichtert.

Fazit: Positive Entwicklung bei React

React hat sich also in jedem Fall positiv entwickelt und ist in seinem Einsatzgebiet nur besser geworden. Die Neuerungen machen die Bibliothek einfach zu handhaben und die Verbindungen mit anderen Programmen ist ebenfalls deutlich intuitiver als zuvor. Weiterhin positiv ist natürlich, dass React inzwischen eine deutlich größere Community hat und so für viele Anwendungen Einbindungen bestehen. In einem ersten Blick auf React hatten wir noch gewarnt, dass viele Applikationen wie eine Lightbox oder Dropdown-Menüs von euch selbst programmiert werden müssen. Das ist heute nicht mehr notwendig, denn es gibt inzwischen zahlreiche Lösungen für derlei Probleme.

Auch mit Version 15.5 ist React natürlich nur dann interessant, wenn ihr ein interaktives Projekt umsetzen wollt. Dafür sind die Möglichkeiten der Bibliothek seit der ersten Veröffentlichung stetig gewachsen und machen einen Blick lohnenswert. Nach der Ankündigung der neuen Version ist die Abwärtskompatibilität eine besondere Erwähnung wert: Auch wenn ihr jetzt mit React 15.5 startet, ist es kein Problem, auf das neue React 16 umzusteigen. React war bisher abwärtskompatibel und soll es laut den Entwicklern auch bleiben.

Bitte beachte unsere Community-Richtlinien

4 Reaktionen
Tim

Ich bin mir ja nicht so sicher, ob die Autorin React verstanden hat... Ich denke eher, dass der Erfolg von React an dem kleinen API-Footprint und der durchdachten Architektur liegt. Darüber ließe sich aber diskutieren. Anders sieht das bei den haarsträubenden technischen Beschreibungen aus: Eine kleine Auswahl von dem, was alles nicht stimmt: Mir ist kein Frontend-Framework bekannt, dass nicht auf Komponenten setzt um ein "modulares User Interface [zu] ermöglichen". Dass das virtuelle DOM im Client (und nicht auf dem Server!) verwendet wird, wurde ja schon angemerkt. Wie genau kann ich React mit anderen Sprachen kombinieren?! Und wieso muss die App nach einer Änderung nicht neu kompiliert werden?! Wenn man darunter das Umwandeln von JSX zu ES5 versteht, muss das bei React nach wie vor für jede Datei-Änderung erfolgen... eventuell kann man seinen Build-Prozess so bauen, dass nur geänderte Dateien durch Babel (oder etwas ähnliches) laufen müssen - aber das ist kein Vorteil von React sondern für so ziemlich jedes Framework möglich. Wieso kann ich mit React alleine keine Webseite "hochziehen" (was auch immer das heißen soll)?! "Funktionen wie die onKey-Events"... wo sind Events Funktionen? Das passt weder technisch noch im Sinne von "Feature". Von dem Fehlercode-System habe ich bisher noch nichts gehört... "Zu Beginn war React eine extrem große Datenmenge" - ich hoffe mal, dass damit gemeint ist, dass sich die Build-Größe verringert hat im Laufe der einzelnen Versionen (wenn das denn so ist...).
"zu null zu rendern"?!?!?! Womit nähert sich React mit irgendwas davon an andere Bibliotheken an? Mal abgesehen davon, dass Angular, Vue.js etc. keine Bibliotheken sind, ist das auch inhaltlich mindestens fragwürdig.
Ich habe selten einen derart schlechten Artikel gelesen... ich finde es zwar gut, wenn auch junge und nicht so erfahrene Autoren einen Platz bei t3n.de bekommen, aber tut den Autoren und euch selbst den Gefallen und lasst einen Redakteur und jemanden mit dem technischen Know-How mal drüber lesen... dann käme da nicht so ein sprachlich seichter und an vielen Stellen schlichtweg falscher Artikel bei raus. Früher war t3n.de doch mal eine Quelle von qualitativen Inhalten... was ist nur passiert?

Antworten
Flo

"Das liegt daran, dass React serverseitig ein virtuelles DOM nutzt, mit dem es dann nur einzelne Elemente abgleicht."

Eben genau *nicht* serverseitig. SSR ist zwar möglich, der grundlegend wichtige Gedanke ist aber, dass clientseitig gerendert wird.

Antworten
Hans

VueJS gefällt mir um einiges besser und ist auch etwas schneller.

Antworten
Tom

Naja, fast richtig. Aber für ein technischen Schreiberling ganz passable. Geeks lesen eh keine t3n Artikel.

Tom - der Griesgram.

Antworten

Melde dich mit deinem t3n Account an oder fülle die unteren Felder aus.