從字節到優化網頁展示的圖像

Question

我以byte []數組的形式獲取數據庫上存儲圖像的數據; 然後我將它轉換爲System.Drawing.Image，如下面顯示的代碼;

public System.Drawing.Image CreateImage(byte[] bytes) 
     { 

      System.IO.MemoryStream memoryStream = new System.IO.MemoryStream(bytes); 
      System.Drawing.Image image = System.Drawing.Image.FromStream(memoryStream); 
      return image; 
     } 

（*）另一方面，我打算在客戶端滾動頁面時顯示asp.net頁面上的圖像列表。越多的用戶在頁面上下下來看到更多的照片。所以它意味着快速的頁面加載和豐富的用戶體驗。 （您可能會在www.mashable.com上看到我的意思，只是照顧照片的新負載，因爲您向下滾動。）

此外，從上述方法返回的imgae對象，如何顯示它在動態使用上面的（*）條件的循環。

問候 BK

Answer 1

嗯，我覺得主要瓶頸實際上是打每次需要的圖像時的數據庫。 （特別是考慮到許多用戶訪問該網站。）

我會與下面的解決方案去：

1. 數據庫將存儲與原有的圖像質量;
2. .ashx處理程序將以各種需要的分辨率（如32x32像素的圖標，48x48縮略圖等）在文件系統上緩存圖像，並根據請求返回它們並訪問數據庫一次; （在this示例中顯示瞭如何通過ashx處理程序返回圖像）
3. 實際頁面將指向.ashx頁面以獲取圖像。 （如<img scr="GetImage.ashx?ID=324453&Size=48" />）

UPDATE：

因此，在處理實際的工作流程是這樣：

public void ProcessRequest (HttpContext context) 
    { 
     // Create path of cached file based on the context passed 
     int size = Int32.Parse(context.Request["Size"]); 
     // For ID Guids are possibly better 
     // but it can be anything, even parameter you need to pass 
     // to the web service in order to get those bytes 
     int id = Int32.Parse(context.Request["Id"]); 
     string imagePath = String.Format(@"images/cache/{0}/{1}.png", size, id); 

     // Check whether cache image exists and created less than an hour ago 
     // (create it if necessary) 
     if (!File.Exists(imagePath) 
      || File.GetLastWriteTime(imagePath) < DateTime.Now.AddHours(-1)) 
     { 
      // Get the file from the web service here 
      byte[] imageBytes = ... 

      // Save as a file 
      using (var memoryStream = new MemoryStream(imageBytes)) 
      using (var outputStream = File.OpenWrite(imagePath)) 
       Image.FromStream(memoryStream).Save(outputStream); 
     } 

     context.Response.ContentType = "image/png"; 
     context.Response.WriteFile(imagePath); 
    }