# React Optimierung ###### tags: `IT` `Ausbildung` ## Analyse ### React Devtools Um die Perfomance der Anwendung zu analysieren oder generell beim Debuggen zu unterstützen kann das Browser Addon `React Devtools` verwendet werden. Es ist für [Firefox](https://addons.mozilla.org/de/firefox/addon/react-devtools/) und [Chrome](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=de), somit in so gut wie allen Browsern, verfügbar. Das Addon fügt zu den Developer Tools des Browsers zwei Tabs hinzu, den `Components` und `Profiler` Tab. #### Components Tab Im Components Tab kann man die aktuelle Struktur der Komponenten betrachten(vergleichbar mit den Inspektor des Browsers). Man bei jedem Komponent die `Props` und den `State` betrachten und bei einem Development Build auch teilweise bearbeiten, ohne dabei den Debugger zu bemühen oder etliche Lognachrichten in den Code hinzuzugüfen.