React

React ist eine Bibliothek zum Aufbau von Benutzeroberflächen aus Komponenten und Zustand. In einer Blockchain-Anwendung hilft sie, asynchrone Daten darzustellen, eine Wallet zu verbinden und den Fortschritt eines Vorgangs zu erklären. Sie führt den Smart Contract nicht aus und entscheidet nicht, ob eine Transaktion bestätigt ist: Sie zeigt Informationen aus anderen Komponenten an.

Die Komposition erlaubt die Wiederverwendung von Formularen, Ladezuständen und Berechtigungsprüfungen. Ziel ist, dass dieselbe Interaktionsregel über verschiedene Ansichten hinweg konsistent bleibt, einschließlich Barrierefreiheit und Verhalten auf Mobilgeräten.

Komponenten beschreiben die Oberfläche anhand ihrer Daten, und Ereignisse aktualisieren den zugehörigen Zustand. Remote-Abfragen müssen zwischen Laden, Fehler, verfügbaren und veralteten Daten unterscheiden. Ein zwischengespeicherter Lesewert kann nützlich sein, um einen Saldo anzuzeigen, belegt aber nicht, dass dieser beim Signieren eines Vorgangs noch ausreicht.

Werkzeuge wie Wagmi verbinden React mit EVM-Contracts und -Wallets. Subscriptions und Effekte müssen bereinigt werden, um doppelte Arbeit zu vermeiden. Vom Nutzer ausgelöste Aktionen, etwa das Anfordern einer Signatur, werden an explizite Ereignisse gebunden und nicht an Effekte, die beim Mounten einer Komponente ausgeführt werden könnten.

Ein Governance-Panel kann Vorschläge anzeigen, die Stimmberechtigung prüfen und eine Abstimmung vorbereiten. Die Oberfläche unterscheidet zwischen der Autorisierung in der Wallet, dem Senden und der Bestätigung. Wechselt der Nutzer Konto oder Netzwerk, werden die betroffenen Daten invalidiert und es wird erneut geprüft, ob die Aktion weiterhin verfügbar ist.

Dieselbe Disziplin gilt für Zahlungen und administrative Vorgänge. Fehlermeldungen müssen beim Fortfahren helfen: Eine abgebrochene Signatur, ein fehlendes Guthaben und ein Revert erfordern unterschiedliche Meldungen. Der Verlauf des Vorgangs lässt sich nach einem Neuladen wiederherstellen, damit der visuelle Zustand nicht die einzige Referenz des Prozesses ist.

React schreibt kein bestimmtes Framework vor und löst Routing, Server-Caching oder SEO nicht von allein. Ein Framework kann Inhalte auf dem Server rendern und Interaktivität Client-Komponenten vorbehalten. Eine interne Anwendung kann eine andere Kombination erfordern; die Wahl hängt von Inhalt und Deployment ab.

Vor dem Optimieren sollten ausgeliefertes JavaScript, unnötige Renders und wiederholte Abfragen gemessen werden. Barrierefreiheit wird mit Tastatur und assistiven Technologien geprüft, zusätzlich zur Überprüfung des visuellen Designs. Relevante Tests durchlaufen Verbindung, Kontowechsel, Ablehnung und Wiederherstellung, nicht nur, ob ein Button auf dem Bildschirm erscheint.