從服務器加載低分辨率的高分辨率圖像（非javascript解決方案）

想象一下，您的Web應用程序的靜態文件夾中有一個10MB圖像文件。從服務器加載低分辨率的高分辨率圖像（非javascript解決方案）

如果您將其加載到HTML文件中，如下所示：<img src="static/image.png"></img>，整個10MB會爲請求圖片的用戶加載。

但是如果標籤是<img src="static/image.png" height="10" width="10"></img>？即它將圖像大小調整爲10px×10px（大概小於10MB）。用戶端是否會加載整個10MB？就個人而言，我認爲用戶仍然會加載10MB。如果我錯了，請糾正我。這是我的第一個問題。

如果我雖然正確，都有些什麼策略來動態縮略圖這種這樣的圖像，在用戶端加載文件的大小被縮小過（短的實際存儲一個單獨的縮略圖文件爲每個圖像在服務器上）。假設它是一個非JavaScript環境，網絡服務器是nginx，並且web應用程序是在Django中構建的（如果有的話）。

存儲單獨的縮略圖是唯一的方法嗎？

來源

2016-02-26 Hassan Baig

是用戶必須下載完整的10Mb。

有一些很好的django應用程序來處理自動thubmnail一代。我使用django-versatileimagefield。在那裏你可以輕鬆實現不同的縮略圖大小。

from django.db import models 

class ExampleModel(models.Model): 
    image = models.ImageField(
    'Image', 
    upload_to='images/' 
) 

>>> from someapp.models import ExampleModel 
>>> instance = ExampleModel.objects.all()[0] 
>>> instance.image.thumbnail['200x200'].url 
'/media/__sized__/images/test-image-thumbnail-200x200.jpg' 

# or in templates: 
<img src="{{ instance.image.thumbnail.200x200 }}" />

來源

2016-02-26 13:05:36 ilse2005

1：是的，用戶會下載大量10MB和瀏覽器將調整（可能使用黑幕大小調整算法，它的選擇）

2：我會生成縮略圖我自己在上傳和存儲的時間它。如果你在飛行中產生它，它可能會很慢，你最終會選擇一個糟糕的算法，以及使用多CPU服務器端。

來源

2016-02-26 12:44:52

是的，即使您調整HTML中的圖像大小，圖像仍然是10MB。我也會創建不同大小的縮略圖並上傳到服務器，而不是服務器進行大小調整。您還可以查看以下網址備用選項 https://www.smashingmagazine.com/2014/05/responsive-images-done-right-guide-picture-srcset/

來源

2016-02-26 13:05:28 user3589690

從服務器加載低分辨率的高分辨率圖像（非javascript解決方案）

回答

相關問題