JavaScript-Bibliothek React 16.8: Das erste Stable Release mit Hooks

Als Alternative zu Classes bietet die neueste Version von Facebooks JavaScript-Bibliothek nun auch React Hooks.

vorlesen Druckansicht 4 Kommentare lesen
React 16.4.0: Jetzt endlich mit Pointer Events

Das React-Logo

(Bild: Facebook, via Wikimedia Commons))

Lesezeit: 2 Min.

Facebooks quelloffene JavaScript-Bibliothek React ist in Version 16.8.0 erschienen. Die wichtigste Neuerung im Stable Release sind React Hooks, die als experimentelles Proposal im Rahmen der React Conf 2018 vorgestellt wurden und seit React Version 16.7 Alpha zum Testen bereitstehen. Als Alternative zu Classes bieten Hooks Entwicklern die Möglichkeit React-Funktionen wie state oder lifecycle zu nutzen, ohne dafür eine Klasse schreiben zu müssen.

Hooks sind keineswegs als Ersatz für Classes gedacht, sondern sollen neue Wege eröffnen, mit verschiedenen Problemen umzugehen, die sich im Verlauf der Weiterentwicklung der JavaScript-Bibliothek ergeben haben. Nach Einschätzung der Entwickler fehlt React bisher eine Methode für die gemeinsame Nutzung zustandsbehafteter Logik, denn die JS-Bibliothek bietet keine Möglichkeit, Komponenten ein wiederverwendbares Verhalten "anzuhängen".

Alle bisher dazu verwendeten Muster wie Render-Requisiten oder Komponenten höherer Ordnung erfordern jedoch eine Umstrukturierung der Komponenten. Typische React-Anwendungen erscheinen dadurch in den React DevTools häufig wie eine "Wrapper-Hölle" und der Code ist nur noch schwer nachvollziehbar.

Empfohlener redaktioneller Inhalt

Mit Ihrer Zustimmung wird hier ein externes YouTube-Video (Google Ireland Limited) geladen.

Ich bin damit einverstanden, dass mir externe Inhalte angezeigt werden. Damit können personenbezogene Daten an Drittplattformen (Google Ireland Limited) übermittelt werden. Mehr dazu in unserer Datenschutzerklärung.

Mit Hooks lässt sich die Stateful Logic einer Komponente extrahieren, sodass sie unabhängig voneinander getestet und wiederverwendet werden kann – ohne die Komponentenhierarchie zu verändern. Darüber hinaus verringern Hooks die Komplexität vieler Komponenten durch deren Aufteilung in kleinere Funktionen – abhängig von den jeweils verbundenen Teilen.

Zu guter Letzt sollen Hooks auch die Hürde für Neueinsteiger in die JavaScript-Programmierung mit React senken, denn Classes gelten als kompliziert und können zu Verwirrung führen. Schon die Unterscheidung zwischen Funktions- und Klassenkomponenten in React und wann man welche verwenden sollte, führe auch unter erfahrenen React-Entwicklern immer wieder zu Meinungsverschiedenheiten. Hooks eröffnen alternative Ansätze, mit denen sich der Einsatz von Classes vermeiden lässt, ohne dafür komplexe funktionale oder reaktive Programmiertechniken erlernen zu müssen.

Weitere detaillierte Informationen finden sich in der Ankündigung zu React 16.8 sowie in der einführenden Dokumentation zu Hooks. Die neue Funktion steht mit dem neuen Release für React DOM, den DOM Server, den Test Renderer sowie den Shallow Renderer zur Verfügung. In React Native ist die Unterstützung für Hooks ab dem Release 0.59 vorgesehen. Einen weiteren Ausblick auf die nächsten Monate bietet die Roadmap. (map)