Cách thiết lập script thực thi bất đồng bộ (async) trong HTML?

Sử dụng thuộc tính async trên thẻ <script> để tải và thực thi script bên ngoài (src) bất đồng bộ — tức là không chặn việc phân tích cú pháp HTML. Script chạy ngay khi sẵn sàng, trước khi trang hoàn tất tải.

Cách hoạt động

• Không có async/defer: HTML dừng phân tích, tải và chạy script, rồi tiếp tục.
• Có async: HTML tiếp tục phân tích song song với tải script; script chạy ngay khi tải xong (thứ tự không đảm bảo nếu nhiều script).
• Có defer: HTML tiếp tục phân tích; script chạy sau khi HTML phân tích xong, theo thứ tự khai báo.

Ví dụ

Tệp new.js:

function sayHello() { alert("Hello World"); }

HTML sử dụng async:

<html>
  <head>
    <script src="new.js" async></script>
  </head>
  <body>
    <p>Đây là văn bản demo.</p>
  </body>
</html>

Khi nào dùng async?

• Script độc lập, không phụ thuộc DOM hoặc script khác (ví dụ: analytics, quảng cáo).
• Muốn tải song song để tăng tốc độ tải trang.