javascript / intermediate
Snippet
Performance-Optimierung mit useMemo
useMemo memoisiert das Ergebnis einer Berechnung und berechnet es nur neu, wenn sich eine der Abhängigkeiten ändert – entscheidend für aufwendiges Filtern oder Sortieren.
snippet.js
1
2
3
const filteredItems = useMemo(() => {return items.filter(item => item.value > threshold);}, [items, threshold]);
react
Erklärung
1
useMemo(() => { ... })
Weist React an, sich den zurückgegebenen Wert zwischen den Render-Vorgängen zu merken.
2
item.filter(...)
Eine Array-Operation, die bei Tausenden von Elementen kostspielig sein kann.
3
[items, threshold]
Führt den Filter nur dann erneut aus, wenn sich die Quellelemente oder das Filterkriterium ändern.