useEffect chạy asynchronously sau khi trình duyệt paint, không block UI. useLayoutEffect chạy synchronously sau DOM mutations nhưng trước khi trình duyệt paint, có thể block paint.
- Dùng useLayoutEffect khi cần đọc layout DOM và synchronously re-render để tránh visual flicker (ví dụ tooltips).
- Mặc định dùng useEffect.
useEffect runs asynchronously after the browser has painted, so it does not block the UI. useLayoutEffect runs synchronously after DOM mutations but before the browser paints, which can block painting.
- Use useLayoutEffect when you need to read DOM layout and synchronously trigger a re-render to avoid visual flicker (e.g., tooltip positioning).
- Default to useEffect for everything else.