What is the difference between useLayoutEffect and useEffect?

useEffect runs after paint, while useLayoutEffect runs synchronously before the browser paints.

useLayoutEffect blocks the browser from painting until it finishes, making it useful for DOM measurements and layout calculations. useEffect runs asynchronously after paint, making it better for side effects like API calls. Overusing useLayoutEffect can hurt performance by blocking rendering.