Khi nào state update là synchronous, khi nào là asynchronous?

Trong React, việc cập nhật state (setState) luôn luôn được lên lịch (scheduled). Bản thân nó không thực sự là Synchronous (Đồng bộ) hay Asynchronous (Bất đồng bộ) theo khái niệm mạng/I/O thông thường, mà do React quyết định thời điểm thích hợp để "flush" (thực thi) các bản cập nhật đó.

• Trong React 18 (Với Automatic Batching): Hầu hết các cập nhật state đều bị trì hoãn (deferred/batched). React sẽ gộp nhiều setState lại thành một lần re-render để tối ưu hiệu năng. Nếu bạn gọi console.log ngay sau setState, bạn sẽ thấy state CHƯA thay đổi ngay lập tức.
• Làm sao để ép cập nhật Đồng bộ (Synchronous)? Nếu bạn thực sự cần React phải tính toán và cập nhật DOM ngay lập tức (ví dụ: cần đọc kích thước DOM sau update), bạn phải bọc setState bên trong hàm flushSync() (import từ react-dom).

import { flushSync } from "react-dom";

// Ép React update DOM ngay lập tức
flushSync(() => {
  setCount(count + 1);
});
// Tại đây DOM đã được cập nhật