預加載#
<link rel="preload">
用於預加載 當前頁面
所需的資源,在瀏覽器解析 HTML 文件之前加載。
<link rel="preload" href="https://example.com/image.png" as="image" />
預取#
<link rel="prefetch">
用於預取 未來頁面
所需的資源,在瀏覽器解析 HTML 文件之後加載。
<link rel="prefetch" href="https://example.com/image.png" as="image" />
預加載 vs 預取#
- 預加載用於加載當前頁面所需的資源,在瀏覽器解析 HTML 文件之前加載。
- 預取用於加載未來頁面所需的資源,在瀏覽器解析 HTML 文件之後加載。
- 預加載的優先級高於預取。