Hooks als Feature für React vorgeschlagen

Hooks für React: Ein neues Feature in React 16.7?
Keine Kommentare

Das React-Team arbeitet an einer Implementierung von Hooks für React. Noch ist sie nicht fertig, sondern soll zuerst mit der Community diskutiert werden. Was würde sich durch Hooks am Framework verändern?

Hooks erlauben die Verwendung von States und anderen Features von React ohne dafür eine Klasse zu schreiben. So soll es in React künftig möglich sein, statusbehaftete Logik mit Hooks aus einer Komponente zu extrahieren und wiederzuverwenden. Auch können Komponenten mit Hooks in kleinere Funktionen unterteilt werden, die anhand ihrer Verbindung zu einander sortiert sind. Außerdem wird es möglich sein, Hooks zur Verwendung von Features zu nutzen statt auf Klassen zu setzen. Das kann im Proposal nachgelesen werden, das in der offiziellen Dokumentation von React veröffentlicht wurde.

Hooks für React 16.7?

Was bedeutet das aber für Entwickler? Die Dokumentation geht auch auf die Auswirkungen ein, die die Einführung von Hooks auf das Arbeiten mit React haben könnte. Diese Effekte lassen sich recht schnell zusammenfassen: Es gibt keine, wenn der Entwickler das nicht möchte. Hooks sollen als Opt-in-Feature eingeführt werden und stellen keinen Breaking Change dar. Auch sollen Klassen in React damit nicht abgeschafft werden und es sei nicht vorgesehen, bekannte Konzepte des Frameworks zu verändern. Es werde nur ein neues API geschaffen, um auf diese zuzugreifen, so erklärt es die Dokumentation. Auch solle es möglich sein, Hooks graduell in Projekte einzuführen. Das React-Team rät explizit davon ab, aufwendige Überarbeitungen an bestehendem Code durchzuführen. Besser sei es, mit einzelnen Anwendungsfällen für Hooks zu beginnen und sich so an die Arbeit damit zu gewöhnen.

Als Beispiel für den Hook useState wird folgender Code-Abschnitt in der Dokumentation angeführt:

import { useState } from 'react';

function Example() {
  // Declare a new state variable, which we'll call "count"
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
}

Weitere Informationen zu Hooks und ihrer Verwendung können der Dokumentation entnommen werden.

Hooks: Nachteile?

Die Einführung von Hooks hätte jedoch nicht nur Vorteile, wie dem RFC zu entnehmen ist. So erhöhe sich durch die Einführung einer neuen Methode zum Schreiben von Komponenten beispielsweise auch der Lernaufwand beim Einstieg in die Arbeit mit React. Außerdem ist vorgesehen, dass Hooks nicht an Bedingungen geknüpft werden können. Eine Verwendung in if-Statements, Loops oder Helper-Funktionen sei dadurch nicht möglich, was verwirrend sein könne. Diese und weitere Kritik kann auf GitHub nachgelesen werden.

Hooks stehen derzeit im Rahmen des Alpha-Release von React 16.7 zum Testen bereit, wurden also noch nicht final implementiert. Im öffentlichen RFC ist die Community dazu aufgefordert, sich zum Proposal zu äußern.

Unsere Redaktion empfiehlt:

Relevante Beiträge

Hinterlasse einen Kommentar

Hinterlasse den ersten Kommentar!

avatar
400
  Subscribe  
Benachrichtige mich zu:
X
- Gib Deinen Standort ein -
- or -