Действительно ли приемлемо оставить изменение размеров изображения до клиента (браузер)

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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