HTML có thuộc tính preload cho phép bạn đưa cho trình duyệt gợi ý về cách, và quan trọng hơn, khi nào tải tài nguyên khi trang tải.
Thuộc tính preload có thể dùng trên một số phần tử HTML. Ví dụ, bạn có thể thêm nó vào phần tử <link> để trình duyệt bắt đầu tải sớm bảng định kiểu CSS.
Đừng dùng preload trên <link> như sau (như một số trang khuyến nghị):
<link rel="preload" rel=stylesheet href="/css/styles.css" as="style">
Vì mã trên chỉ preload bảng định kiểu, nó không áp dụng nó.
Thay vào đó, để vừa preload vừa áp dụng bảng định kiểu (ngay sau khi preload xong), bạn có thể dùng trình xử lý sự kiện JS onload nội tuyến trên <link>:
<link rel="preload" href="style.css" as="style" onload="this.rel='stylesheet'">
Trình xử lý sự kiện JS onload sẽ thay đổi thuộc tính rel="preload" của phần tử link thành rel="stylesheet" ngay khi tải xong.
Với cấu hình trên, trình duyệt hỗ trợ preload sẽ bắt đầu tải bảng định kiểu CSS sớm hơn nếu không dùng thuộc tính.
Hỗ trợ trình duyệt
Thuộc tính preload chưa được hỗ trợ trong Firefox (lạ), nhưng hoạt động trong tất cả trình duyệt hiện đại khác. Bạn vẫn có thể dùng preload, nó chỉ không prefetch CSS trong Firefox (sẽ tải bình thường).