useLayoutEffect Similar to useEffect but fires synchronously after all DOM mutations(react docs).
It can be used to make changes before the browser has a chance to paint.
I can think of two instances where it can be applied;
Dynamically setting document title
useLayoutEffect(() => { document.title = "Profile"; }, []);
The page title is set before the browser has a chance to paint.
const { handleLogout } = useAuth();
useLayoutEffect(() => { checkTokenValidity(handleLogout); }, [handleLogout]);