瀏覽器是否針對不同的圖像寬高比進行了優化？

Question

這個問題可能有一個非常複雜的答案，但這裏有：

我已經創建了一些圖像精靈使用天真疊加算法產生的圖像是89px寬2000px高。該圖像將用於頁面上的大約50個精靈。這個精靈的格式是.GIF格式，我幾乎不知道GIF如何編碼像素，（我不知道它是行/列主要還是其他一些打包算法）。

精靈圖像中的總像素數爲178,000。

我可以改變我的精靈生成算法，以產生一個445像素寬，400高（相同像素數，只是創建一個圖像網格，而不是一個列）的精靈。

更改精靈的配置是否會產生更好的瀏覽器DOM加載/渲染性能？ （我特別感興趣的IE 8和移動瀏覽器，如iOS上的Safari）

Answer 1

與所有優化問題一樣......如果不測量它，很難說。

但是...基於GIF文件編碼的方式我懷疑你的當前佈局比一個更寬的縱橫比圖像執行「更好」。

有關GIF文件格式的文檔說「因此可能一條掃描線會結束，另一條掃描線會在圖像數據的子塊中間開始」。

由於圖像數據是LZW壓縮的，並且由於來自同一圖標的像素更可能是相同的顏色（即使它們來自相反的邊緣和一行下方），您的當前佈局可能會更好地壓縮因此它可能表現更好。

但是我確信有很多病態的情況，其中反過來是真實的，同樣有信心任何佈局的性能增益可能會很小，無疑有更好的優化值得擔心。