Variationen des useEffect-Hooks in React

Der Hook useEffect hat noch weitere Variationen, die spezifisch sind und sehr selten verwendet werden, daher werden wir nur kurz auf sie eingehen.

Die erste Variation ist der Hook useLayoutEffect, der ausgelöst wird, bevor der Browser den Bildschirm neu zeichnet. Diese Möglichkeit können Sie nutzen, um die Größe und Position einer Komponente in Abhängigkeit von anderen Elementen zu berechnen, damit der Browser sie dann beim Zeichnen sofort wie und wo nötig anzeigt. Dank dieses Hooks sieht der Benutzer beispielsweise keine Zwischensprünge der Komponente bei Änderungen der Position oder Größe, sondern nur deren endgültige Versionen.

Die zweite Variation ist der Hook useInsertionEffect, der ausgelöst wird, bevor irgendwelche Änderungen am DOM-Baum vorgenommen werden, also dann, wenn die refs noch nicht angehängt sind und das DOM nicht aktualisiert wurde. Er wird hauptsächlich dort eingesetzt, wo dynamische Styles aus CSS-in-JS-Bibliotheken vor Änderungen am DOM eingefügt werden müssen.