優化 CSS 交付：了解延遲 CSS 載入技術

為了提高網站效能，開發人員通常會優化 CSS 交付。 Google 開發者文件中提到的策略之一是在

但是，這給我們留下了一個問題：頁面加載後如何加載大型 CSS 文件？

解決方案：推遲加載大型CSS 文件

要推遲加載大型CSS 文件，我們可以使用一個簡單的jQuery 代碼片段：

    function loadStyleSheet(src) {
    if (document.createStyleSheet){
        document.createStyleSheet(src);
    }
    else {
        $("head").append($("<link rel='stylesheet' href='" src " />"));
    }
};

透過在$(document).ready()或window.onload函數中呼叫該函數，我們可以在頁面載入完成後動態載入CSS檔案。

方法驗證

要驗證此方法是否有效，請嘗試在瀏覽器中停用 JavaScript，然後重新載入頁面。如果應用了樣式表後頁面仍然正確加載，則表示 CSS 加載已成功延遲。

替代方法

還有延遲 CSS 載入的替代方法，例如與使用