CSS 可以異步加載嗎？為了回答這個問題，我們需要了解一下 CSS 是如何加載和解析的。
CSS 樣式通常與 HTML 文檔分離，可以通過以下方式引入：
<head> <link rel="stylesheet" href="style.css"> </head>
當 HTML 文檔被加載時，瀏覽器會同時加載所引用的 CSS 文件。然后，它將解析 CSS 并將樣式應用于 HTML 元素。
由于 CSS 文件對于頁面的外觀和布局非常重要，因此在添加 CSS 樣式之前，可能會看到閃爍或 FOUC（樣式失效時顯示的頁面）。這是因為頁面首先呈現為無樣式的 HTML，并且在 CSS 文件被加載和應用之前，瀏覽器無法確定元素的大小、位置或樣式。
現在回到我們的問題，CSS 是否可以異步加載？答案是肯定的。可以使用異步方式加載 CSS 文件，以避免 FOUC 或頁面加載延遲的問題。可以通過以下方式實現：
<script>
var link = document.createElement('link');
link.rel = 'stylesheet';
link.href = 'style.css';
document.head.appendChild(link);
</script>這段 JavaScript 代碼將創建一個新的 <link> 標簽，并將其添加到文檔頭部。由于這是通過 JavaScript 動態添加的，因此它的加載和解析是異步的。這意味著頁面可以在使用樣式之前呈現。
需要注意的是，當使用異步方式加載樣式表時，首屏加載時間可能會變得稍微慢一些，因為 JavaScript 必須執行完畢，然后才會加載樣式表。此外，異步加載樣式表會增加代碼復雜性，因為需要手動創建和管理樣式表的加載和應用。
總之，CSS 可以異步加載。但是，請在權衡利弊后再決定是否使用異步方式加載樣式表。