Допустимо ли изменение размера изображения до клиента (браузера) - PullRequest
8 голосов
/ 01 августа 2010

Браузеры могут изменять размеры изображений на основе указанных вами атрибутов.

Однако я полагаю, что большинство изменений размеров выполняется на стороне сервера, предпочтительно до запроса.Принимая во внимание скорость современных процессоров, а также ради простоты и, возможно, экономии полосы пропускания, когда-либо допустимо оставлять изменение размера изображения в браузере?

Ответы [ 6 ]

15 голосов
/ 01 августа 2010

Да, браузеры могут изменять размеры изображений на основе атрибутов ширины и высоты, однако вы не можете контролировать качество изображения с измененным размером.Если это то, что вас вообще волнует, то это должно быть сделано на стороне сервера.

Еще одна вещь, на которую следует обратить внимание, это то, что, хотя изображение с измененным размером меньше исходного, оно по-прежнему имеет тот же размер файла, что иполноразмерное изображение.Поэтому, если вы оставляете браузеру создание файла размером 2 МБ размером 100 на 100 пикселей, пользователю все равно необходимо сначала загрузить все 2 МБ файла.

10 голосов
/ 01 августа 2010

Один вариант использования - это когда у вас есть миниатюра и в полноразмерном изображении или для отображения различных размеров. В этом случае можно использовать одно изображение и изменить его размер. Обратите внимание, что современные браузеры теперь используют бикубическую передискретизацию, поэтому вы не столкнетесь с неровными, грубыми интерполяциями с большим количеством артефактов при изменении размера, что раньше было очень веской причиной НЕ позволять браузеру изменять размер изображения.

5 голосов
/ 01 августа 2010

Даже с учетом прогресса, достигнутого нами в плане увеличения пропускной способности потребителей, я все еще не считаю приемлемым позволить браузеру изменять размер изображения.В действительности пропускная способность по-прежнему сильно варьируется в зависимости от уровня обслуживания, предоставляемого пользователем.

Вам также необходимо подумать о вероятных вариантах использования.Представьте себе список новостных историй, каждая из которых имеет собственный эскиз, основанный на основном изображении основной статьи.Теперь предположим, что мы показываем 20 из них в одном постраничном представлении.

Даже те, у кого большие соединения с пропускной способностью, будут замечать, что (ради аргумента) появляются 2-мегабайтные изображения. Это предполагает, что тот, ктозагрузка контента практикует некоторую сдержанность, когда дело доходит до размера изображения.Изображения могут стать на тонну больше, если, скажем, они пришли прямо из сканирования.

Если ваш сайт находится в общедоступном Интернете, вы можете почти гарантировать, что у некоторых ваших пользователей будет недостаточная пропускная способность.Жалобы будут приходить, и в конечном итоге это плохо отразится на вас.

Мы даже не рассмотрели такие вещи, как соотношение сторон.Что происходит, когда клиент пытается поместить длинное и тонкое изображение в контейнер, предназначенный для квадратного?Сайт выглядит непрофессионально, вот что.

А как насчет стоимости отправки этих больших файлов n клиентам?Пропускная способность не свободна.

Так что нет, заставить браузер изменять размеры изображений никогда не приемлемо, особенно если вы можете инвестировать или разрабатывать библиотеку управления изображениями на стороне сервера.Это позволит обрабатывать изменения размера, обрезки и т. Д. Это также поможет вам обеспечить максимально эффективную работу для всех ваших пользователей.Не у всех есть 50Mb, идущие в их помещение.

4 голосов
/ 01 августа 2010

Я столкнулся с сайтом, который купил стоковые фотографии и встроил оригинальные изображения размером 2 Мпикс на их веб-страницу с директивами width и height размером эскиза ~ 150 пикселей. Я только заметил, потому что загрузка страницы заняла около минуты.

С другой стороны, я мог увеличить свой браузер на 300%, и изображения остались четкими (и все еще не достигали своего исходного разрешения). Я предполагаю, что это не было целью дизайна.

3 голосов
/ 01 августа 2010

Изменение размера, которое происходит в браузере, является просто отображением - полное изображение загружается и просто отображается с требуемым размером.То, как они выглядят, будет определяться некоторыми алгоритмами изменения размера изображений, написанными авторами браузера - вы не контролируете качество.

Это вопрос пропускной способности и, возможно, использования ЦП и памяти клиентом.

Как вы предполагаете, большинство изображений имеют размеры заранее, задолго до любого запроса.Даже с быстрыми процессорами вы не захотите делать это на лету.

Меньшие изображения также означают, что пользователи, не имеющие широкополосного доступа, смогут наслаждаться вашим сайтом, не дожидаясь загрузки больших изображений.

2 голосов
/ 01 августа 2010

Я лично делаю изменение размера изображения (миниатюры) на сервере и храню их в отдельной папке. Это помогает мне поддерживать низкую пропускную способность.

Если вы не хотите хранить их на своем сервере и просто делаете это по запросу (онлайн), вы можете использовать классные сценарии, например, например. TimThumb - это: http://www.darrenhoyt.com/2008/04/02/timthumb-php-script-released/

Каждый зависит от загрузки вашего сервера и количества изображений на странице (или трафика, конечно) Если вы хотите сохранить их на своем сервере, вы можете использовать http://phpthumb.sourceforge.net/ или ImageMagick (я использую его для миниатюр + водяные знаки)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...