ASP.NET MVC如何優化數百個圖像以減少http請求

Question

我有一個網站，其中顯示數百個產品目錄與JPEG文件（文件大小40kb - 150kb）。我意識到我的網站會產生數百個http請求。你有什麼想法如何優化asp.net MVC中的數百個圖像？

Answer 1

1. 將圖像嵌入到Base64編碼的頁面中，而不是使用它們的URL。這將減少網頁瀏覽器所需的http請求數量。

   http://lucdebrouwer.nl/how-to-base64-encode-your-images/

2. 壓縮你的頁面。

   http://developer.yahoo.com/performance/rules.html

更新：這裏是你如何轉換圖片對象爲Base64在Asp.Net MVC

private string ImageToBase64(Image image, 
           ImageFormat format) 
    { 
     using (var ms = new MemoryStream()) 
     { 
      // Convert Image to byte[] 
      image.Save(ms, format); 
      byte[] imageBytes = ms.ToArray(); 

      // Convert byte[] to Base64 String 
      string base64String = Convert.ToBase64String(imageBytes); 
      return base64String; 
     } 
    } 

    private Image Base64ToImage(string base64String) 
    { 
     // Convert Base64 String to byte[] 
     byte[] imageBytes = Convert.FromBase64String(base64String); 
     using (var ms = new MemoryStream(imageBytes, 0, 
             imageBytes.Length)) 
     { 
      // Convert byte[] to Image 
      ms.Write(imageBytes, 0, imageBytes.Length); 
      Image image = Image.FromStream(ms, true); 
      return image; 
     } 
    } 

你使用它，像這樣：

<img src="data:image/jpeg;base64,' + yourImageBase64string + '" /> 

保持考慮到這樣做可能不會使你的頁面加載速度更快，而不會壓縮你的頁面。爲什麼你不能只顯示這些圖像的一個子集，讓用戶在它們之間導航？