React 16 verbessert den Umgang mit Fehlern
Die von Facebook entwickelte JavaScript-Bibliothek hat außerdem einen komplett überarbeiteten Server-Renderer, der Inhalte an Clients streamen kann. Ab sofort gilt für das Open-Source-Projekt die MIT-Lizenz.
Die Open-Source-Bibliothek React zum Erstellen und effizienten Rendern von Anwendungsoberflächen bekommt mit Version 16.0 einige technische Neuerungen und eine neue Lizenz. Letztere wurde in den letzten Wochen heftig diskutiert. Die von Facebook verwendete "BSD+Patents"-Lizenz führte unter anderem dazu, dass sich die Apache Foundation gegen die Verwendung der darunter lizenzierten Produkte ausgesprochen hatte. Nach erstem Zaudern erklärte Facebooks Engineering Director Adam Wollf, dass einige Produkte, darunter die JavaScript-Bibliothek, auf die MIT-Lizenz wechseln sollten. Diese gilt ab sofort für React.
Erweiterungen für Server- und Client-Renderer
Die technischen Neuerungen beziehen sich vor allem auf den Bereich Fehlerbehandlung und Rendering. Die Macher haben den Server-Renderer komplett neu geschrieben. Er soll insgesamt deutlich performanter sein. Der Blogbeitrag zum Release spricht vom Faktor drei gegenüber React 15. Verantwortlich dafür ist unter anderem eine veränderte Packaging-Methode, die vor allem die process.env-Prüfung herauskompiliert – offensichtlich benötigt Node.js lange zum Lesen der Umgebungsvariablen. Außerdem kann der Server-Renderer die Inhalte nun an den Client streamen.
Ebenfalls neu ist, dass die render-Methode der Komponenten nun sowohl Strings als auch Arrays zurückgeben kann, ohne für Letztere ein separates Element zu erstellen. Derzeit müssen Entwickler dazu key-Werte definieren, aber das Team plant eine spezielle Syntax, die die Verwendung von Schlüsseln überflüssig macht. Die Rückgabe einer Liste sieht folgendermaßen aus:
render() {
return [
<li key="A">Erstes Element</li>,
<li key="B">Zweites Element</li>,
<li key="C">Drittes Element</li>,
];
}
Schadensminimierung bei Fehlern
Das Team hat das Error-Handling überarbeitet, da in älteren React-Versionen Laufzeitfehler zu kryptischen Meldungen führten oder gar ein Neuladen der Seite zum Beheben erforderten. React 16 führt mit ErrorBoundary-Komponenten ein System ein, dass mit try-catch-Blöcken vergleichbar ist: Wenn innerhalb der Komponente ein Fehler auftritt, schreibt es eine Fehlernachricht in eine Log-Datei und stellt ein Fallback-Element dar, das beispielsweise ein Textfeld mit der Fehlernachricht sein kann.
Zu den weiteren Neuerungen gehört, dass React unbekannte HTML- oder SVG-Attribute über den DOM Tree (Document Object Model) weiterreicht, statt sie wie bisher zu ignorieren. Schließlich erlauben die über createPortal erstellten Portale das Einfügen von Kindelementen an einem beliebigen Knoten innerhalb des DOM Tree, losgelöst vom aktuellen Elternelement.
Weitere Details sind im React-Blog zu finden. React 16 lässt sich über npm oder yarn aus der npm-Registry installieren. Die Bibliothek ist zudem – nun unter MIT-Lizenz – auf GitHub verfügbar.
Siehe dazu auf heise Developer:
(rme)
