Variations du hook useEffect dans React

Le hook useEffect possède également des variations, qui sont spécifiques et très rarement utilisées, c'est pourquoi nous les aborderons brièvement.

La première variation est le hook useLayoutEffect, qui se déclenche avant que le navigateur ne repeigne l'écran. Vous pouvez utiliser cette fonctionnalité pour calculer les dimensions et la position d'un composant en fonction d'autres éléments, afin qu'ensuite lors du rendu, le navigateur l'affiche immédiatement comme il faut et où il faut. Grâce à cela, par exemple, l'utilisateur ne verra pas de sauts intermédiaires du composant lors du changement de position ou de dimensions, mais seulement leurs versions finales.

La deuxième variation est le hook useInsertionEffect, qui se déclenche avant toute modification de l'arborescence DOM, c'est-à-dire à un moment où les refs ne sont pas encore attachés et le DOM n'est pas mis à jour. Il est principalement utilisé dans les cas où il faut insérer des styles dynamiques provenant de bibliothèques CSS-in-JS avant la modification du DOM.