Der React-Compiler ist wichtig, weil er ändert, wer für einige Render-Optimierungen verantwortlich ist.
Historisch verwendeten React-Entwicklungsteams:
useMemo
useCallback
React.memo
um unnötige Neuberechnungen und Render-Zyklen zu vermeiden.
Das hat funktioniert, aber es hat auch Code hervorgebracht, der laut, fragil und leicht fehlerhaft ist.
Was der Compiler tatsächlich ändert
Der Compiler kann den Komponenten-Code analysieren und automatisiert optimierungen anwenden, die einer Memoization ähnlich sind, wenn der Code Mustern folgt, über die er sicher nachdenken kann.
Das bedeutet, dass ein Teil der manuellen Memoization überflüssig wird.
Das wichtige Wort ist „ein Teil“.
Es bedeutet nicht:
- dass jedes
useMemo verschwinden sollte
- dass jedes
useCallback obsolet ist
- dass die Leistung jetzt in jedem Codebasis automatisch ist
Compiler helfen nur, wo sie beweisen können, dass die Transformation sicher ist.
Was immer noch Urteil erfordert
Sie benötigen weiterhin technisches Urteilsvermögen in Bezug auf:
- kostenintensive Berechnungen
- Drittanbieter-Bibliotheken mit referenzsensitiven APIs
- absichtlich stabile Identitäten über Grenzen hinweg
- Code, den der Compiler nicht sauber optimieren kann
Die gesündere Erkenntnis ist daher:
"Verwenden Sie standardmäßig weniger defensiven Memo-Hooks und profilieren Sie die Stellen, die weiterhin wichtig sind."
Das ist eine bessere Regel als „löschen Sie alle Ihre Hooks.“
Warum das immer noch ein großes Problem ist
Manuelle Memoization hatte immer einen Wartungskosten:
- Abhängigkeitsarrays werden veraltet
- Code wird schwerer lesbar
- Entwickler importieren Optimierungen ohne Verständnis an Stellen, die sie nicht benötigen
Wenn der Compiler einen Teil dieser Steuer entfernen kann, ist das eine echte Verbesserung sowohl in der Ergonomie als auch in der Korrektheit.
Weiterführende Literatur