Working Draft

Danke für das interessante Thema und diese Folge. Mich hat das Thema React vor grob zwei Jahren erstmalig erreicht. Zwei Jahre und einige hunderte React Komponenten später kann ich vieles was Hans und Peter sagen so bejahen.

– Redux: Die gute Testbarkeit der Redux Reducer war sehr hilfreich, da darin sehr viel Business-Logik abgehandelt und dadurch auch gut getestet werden konnte. Dies war dann natürlich auch hilfreich bei folgenden Refactorings.
– Hooks, functional components, useEffect etc.: Ich mache gerade die gleichen Erfahrungen wie Hans, dass einige unserer funktionalen Komponenten relativ groß werden, mit verschiedensten useEffects. Ich finde es mittels hooks und useEffect sehr viel einfacher Rerenderings zu provozieren (z.B. wenn Objektinhalte komplett identisch, aber neu referenziert werden). React Profiler fand ich in dem Zusammenhang relativ hilfreich, da dieser auch den Grund für Rerenderings anzeigen kann, womit das Debuggen etwas vereinfacht wird (https://reactjs.org/blog/2018/09/10/introducing-the-react-profiler.html).

Nach aktuellem Stand sind folgende Punkte beim Maintainen einer größeren React-Codebase am Wichtigsten:

– Linting-Rules festzurren um einheitliche und besser lesbare Komponenten zu erzeugen
– Naming conventions für wiederkehrende Properties definieren um Verständlichkeit über die Codebase hinweg zu verbessern
– Regelmäßiges Überprüfen der Komponenten auf evtl. nicht mehr benötigte Props und vermeiden Props über eine gewisse Anzahl an Layern weiterzuleiten
– Codebase-Struktur: Wir folgen hier dem Atomic Design Prinzip und haben entsprechende Ordnerstrukturen (http://atomicdesign.bradfrost.com/chapter-2/). Allerdings selbst da stößt man irgendwann an die Grenzen der Übersichtlichkeit. :)

LG Andi