Variazioni dell'hook useEffect in React

L'hook useEffect ha altre variazioni, che sono specifiche e molto raramente utilizzate, quindi le tratteremo brevemente.

La prima variazione è l'hook useLayoutEffect, che viene attivato prima che il browser ridisegni lo schermo. Questa funzionalità puoi utilizzarla per calcolare le dimensioni e la posizione di un componente in base ad altri elementi, in modo che durante il rendering il browser lo visualizzi immediatamente come e dove necessario. Grazie a ciò, ad esempio, l'utente non vedrà salti intermedi del componente durante la modifica della posizione o delle dimensioni, ma solo le loro versioni finali.

La seconda variazione è l'hook useInsertionEffect, che viene attivato prima di qualsiasi modifica all'albero DOM, cioè in quel momento, quando i ref non sono ancora stati allegati e il DOM non è stato aggiornato. Viene utilizzato principalmente laddove è necessario inserire stili dinamici da librerie CSS-in-JS prima della modifica del DOM.