2010-05-19 32 views
2

據我所知,現在有兩種主要的技術用於在網站中包含CSS。性能,一次提供所有CSS,還是根據需要提供?

A)提供一個用於由網站的所有CSS(壓縮)文件 B)爲需要由當前正被觀看僅

積極因素對於A中的頁面上的元素提供的CSS:整個在網站上使用CSS通過1個http請求
否定緩存在第一次訪問了答:如果它是一個大的文件,這將需要很長時間才能開始加載

積極因素對B:更快的初始加載時間
否定對於B:更多HTTP請求,更多要緩存的文件

有什麼(基本),我在這裏失蹤?

+0

我相信你不會錯過任何必要的東西。有些東西像並行下載,但除非你將圖像存儲爲數據 - uri,那麼這是可以忽略的。 – 2010-05-19 23:48:19

回答

3

簡介它。這取決於您的用戶使用您的網站的方式。

如果它是一個Web應用程序,並且您的用戶可能會與其進行很多交互並且看到您設計的大部分佈局,那麼您可能希望使用一次加載一次然後存儲在瀏覽器緩存中的CSS。在這種情況下,首次開銷可以忽略不計。

如果您的大多數用戶使用冷藏緩存,只查看兩三頁,單獨的CSS文件可能會改善他們的體驗。

如果不看看用戶實際做了什麼,就無法分辨。

+0

+1這是關於你的觀衆如何使用你的網站。 – 2010-05-20 01:17:44

0

有什麼更好?

  1. 寫一個CSS文件
  2. 寫更多的css文件

有什麼好?

  1. 跟蹤,保持1個css文件更新
  2. 跟蹤,保持更多的css文件更新

什麼esier?

  1. 做決定什麼插入到一個css文件
  2. 決定要放什麼東西在每一個你的CSS文件

什麼比產生一個全局CSS文件生成每個單獨的css文件的費用。

+0

這些都是好的,但是與我的個人工作流程無關,我傾向於將CSS寫入partials(已經分開),所以編寫,跟蹤和包含這些內容是很費力的。 – 2010-05-19 23:44:56

1

即使是一個大的CSS文件,gzipped,與其他很多事情(如圖片,電影等)下載相比,是微不足道的。將CSS分解爲單獨文件的唯一真正原因是交換特殊規則以使某些瀏覽器行爲正常(我在看你,IE)。

1

沒有A B,它總是兩者之間的折衷。例如:您希望首頁儘快加載,因此您只需要請求。對於以下頁面,您可以請求剩下的CSS。共有2個請求。

實質上,您正在創建相關CSS的包/組。通過動態組合和壓縮這些軟件包,您可以創建可維護的文件結構。這也使您能夠實驗速度,性能,請求和帶寬的最佳組合...

這整個故事也適用於JavaScript文件,因爲可以做出相同的折衷。

相關問題