這種延遲如何可能？

Question

我試圖優化我的網站的加載時間，因爲它太長時間，它仍然是，但尤其是對jQuery UI的CSS圖片，

如果你有一分鐘​​，請你看this Pingdom test？

在60和75號文件中，jQuery CSS文件中只有很少的圖像（只是重命名了路徑）。他們需要長達3秒的時間來連接，然後他們似乎快速加載..但是秒連接？

的一塊CSS的與此相關的：

.ui-icon { width: 16px; height: 16px; background-image: url(/css/images/ui-icons_222222_256x240.png); } 
.ui-widget-content .ui-icon {background-image: url(/css/images/ui-icons_222222_256x240.png); } 
.ui-widget-header .ui-icon {background-image: url(/css/images/ui-icons_222222_256x240.png); } 
.ui-state-default .ui-icon { background-image: url(/css/images/ui-icons_888888_256x240.png); } 
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(/css/images/ui-icons_454545_256x240.png); } 
.ui-state-active .ui-icon {background-image: url(/css/images/ui-icons_454545_256x240.png); } 

而這個CSS文件的路徑爲：/CSS/ui.css

和圖片的路徑是：/CSS/images/*.png

如果這不是路徑，我完全迷失在這裏，任何線索？

Answer 1

其他的事情要考慮的是，您的瀏覽器使用的緩存。所以，當你像這樣運行一個測試時，它看起來像JQuery UI圖像非常慢。但是對於用戶（在適當的瀏覽器緩存設置下），「懲罰」只會發生一次。所以，實際上這不是一個完全公平的測試。

我更擔心你的40kb背景圖像和不完美優化的CSS。在你的css文檔上嘗試this website以降低13％的開銷（在主站點css上）。另外，通過將CSS文檔組合在一起可以降低HTTP開銷。同樣，感謝瀏覽器緩存的概念，這對於正確設置的瀏覽器來說只是一次改進。

與許多網站相比，這個加載相當快。除非你的網站每天要花費20多萬美元，或者你要用kb支付帶寬，否則設置就足夠了。

Answer 2

我沒有看到這麼長時間的延遲。看起來他們需要不到一秒的時間才能加載。