React: Anleitungen und Praxiswissen | Seite 7 | mironsoft Blog
React
-
11.10.2025
Wer 10.000 React-Elemente ins DOM schreibt, baut eine Anwendung, die für Nutzer nicht bedienbar ist. Virtualisierung rendert nur die sichtbaren Zeilen — der Rest ist Mathematik. Wie man das mit TanStack Virtual, react-window und eigenen Implementierungen umsetzt.
-
09.10.2025
Ein grüner jest-axe-Report bedeutet nicht, dass eine React-Anwendung mit NVDA oder VoiceOver tatsächlich bedienbar ist. Automatisierte Tools finden strukturelle ARIA-Fehler, aber keine verwirrende Ankündigungsreihenfolge oder unlogische Fokus-Sprünge. Dieser Guide zeigt, wie man Screenreader-Tests für React-Apps systematisch mit beiden Ebenen aufbaut.
-
09.10.2025
@testing-library/user-event simuliert komplette Interaktionsabfolgen wie ein echter Browser, während fireEvent ein einzelnes DOM-Event synchron auslöst. Der Unterschied wirkt klein, entscheidet aber häufig darüber, ob ein Test reale Bugs findet oder blind daran vorbeiläuft.
-
09.10.2025
React 19 bringt neue Hooks und verfeinert bestehende – doch das größte Problem in der Praxis ist nicht Unkenntnis, sondern falsche Wahl: useEffect wo useRef reicht, useMemo wo kein Memoizing nötig ist. Dieses Cheatsheet gibt klare Entscheidungsregeln, wann welcher React Hook der richtige ist.
-
08.10.2025
Snapshot Testing verspricht, jede unbeabsichtigte Änderung an einer Komponente automatisch zu erkennen. In der Praxis werden riesige, unlesbare Snapshots aber oft blind per Tastendruck aktualisiert, statt echte Regressionen zu untersuchen. Dieser Artikel zeigt, wo Snapshot Testing wirklich hilft und wo gezielte Assertions und kleine Inline Snapshots deutlich mehr Sicherheit bringen.
-
30.09.2025
PWA Studio liefert eine fertige Peregrine-Architektur mit vorgefertigten Komponenten, während ein eigenes React Frontend volle Kontrolle über Design, Bundle-Größe und Abhängigkeiten bietet. Die Entscheidung hängt weniger von Trends ab als von Team-Größe, Zeitrahmen und der Individualität der geforderten Shop-Erlebnisse.
-
29.09.2025
Loading-Spinner, Fehlermeldung, Daten: Dieses Dreieck aus State tippt sich in jeder Komponente, die Daten von einer API lädt, fast identisch. Ein eigener Custom Hook bündelt dieses Muster an einer Stelle, bevor er automatisch zu jeder Komponente wandert, die ihn braucht, und zeigt gleichzeitig, wo der Eigenbau endet und eine Bibliothek wie TanStack Query beginnt.
-
28.09.2025
Prop-Drilling und monolithische Komponenten mit dutzenden Props sind ein sicheres Zeichen für eine Architektur, die nicht skaliert. Das Compound Components Pattern in React löst dieses Problem durch explizite Komposition: Sub-Komponenten teilen implizit State über Context, die API bleibt selbstdokumentierend und maximal flexibel.
-
28.09.2025
Komponenten, die gleichzeitig Datenfetching, Formularvalidierung und UI-State verwalten, sind schwer zu testen, schwer zu warten und schwer wiederzuverwenden. Custom Hook Extraction ist das fundamentale React-Pattern, das Logik von der Darstellung trennt – und damit beides besser macht.
-
27.09.2025
Das React Error Boundary Interface arbeitet intern mit dem Typ unknown fuer gefangene Fehler, was Fallback Komponenten oft zwingt, auf any oder unsichere Casts auszuweichen. Mit generischen Typparametern und Discriminated Error Types lassen sich Error Boundaries bauen, die dem Aufrufer konkrete, typisierte Fehlerinformationen liefern.