服務一個大的CSS文件

我有一個大型的CSS文件大約50k，這是由約30頁引用。服務一個大的CSS文件

將CSS分隔成一個基本文件，每個頁面都有單獨的CSS文件，這大大減少了加載時間，或者正在爲一個大文件提供幾乎相同的服務？謝謝。

2011-10-06 David542

你是什麼意思的「一個基本文件與單獨的CSS文件」？ –

由於來自同一個域的連接數量受到限制，我猜測它會大致相同。雖然我不知道100％。如果你期望在IE上運行，你可能會遇到一個問題，儘管不是所有的樣式都被識別。 IE限制文件大小（或者至少是：http://joshua.perina.com/africa/gambia/fajara/post/internet-explorer-css-file-size-limit） – scrappedcola

最好的辦法是把它分成更多文件，並運行WebKit Audits，查看網絡和加載時間。 – Cipi

50k真的不是那麼大 - 特別是對於大多數人的互聯網連接。

我會保持單一的文件，這是因爲：

你只需要一個HTTP請求加載整個CSS
CSS將盡快加載整個網站作爲一個單一頁面訪問（這是進一步瀏覽尼斯）

類似的話題將是使用sprite sheets - 這實質上是在包含多個圖像是一個大文件同樣的事情是在許多較小的圖像時下有利。

來源

2011-10-06 22:22:56 Marty

我並不完全確定你的意思，但服務一個大文件並正確緩存它肯定是一種可行的方式 - 理想情況下，每個客戶端只會產生一個HTTP請求。

來源

2011-10-06 22:19:36

感謝您的精彩回答，但「@import」語句是否會增加http請求？那種方法呢？ –

@Ali是的，'@ import'會導致另一個HTTP請求。 –

謝謝你，所以最好是合併所有的CSS文件或者使用CSS預處理器的特殊'@ import'，對吧？ –

-1

是分開它們爲每個頁面會減少每個頁面的加載時間，因爲每個頁面只會拉動它需要的CSS。

來源

2011-10-06 22:20:34 flynfish

Nope - 這實際上非常肯定*增加*加載時間，因爲它可以保證每個頁面都需要一個額外的HTTP請求 - 通常的延遲時間要比加載一次50kb需要更長的時間，並讓它們被瀏覽器緩存網站上的每一頁。唯一的例外是*可能會*真的很慢*互聯網連接如14400b調制解調器撥號 –

不可以。您忘記了緩存。 – slhck

但是，然後你點擊HTTP請求的最大連接數和開銷。 – PCasagrande

假設每個頁面都使用了大部分CSS，理想的服務方式就像是一個大文件。 HTTP請求需要花費一些時間，以便頁面請求幾個小文件需要一段時間才能加載，更不用說同時連接數量的限制。其次，更重要的是，適當的緩存意味着他們只需要下載整個文件一次。

來源

2011-10-06 22:22:07 PCasagrande

服務一個大的CSS文件

回答

相關問題