Быстрый способ уменьшить изображения HTML?

Question

Я знаю 3 основных способа сжатия изображений:

1. Использование тега img WIDTH HEIGHT
2. Помещение всех изображений в DIV, а затем масштабирование всего деления.
3. Пользовательский масштаб с помощью ctrl + колесико мыши.

У меня есть несколько страниц с огромным количеством изображений. Я заметил, что между методами существует огромная разница в скорости. Метод 1 очень быстро убивает Firefox. Метод 3, кажется, самый быстрый из всех броузеров, которые я пробовал.

Кто-нибудь знает какие-либо другие методы? И есть ли способ через javascript / css указать, какой должен быть уровень масштабирования браузера, чтобы я мог, по крайней мере, использовать самый быстрый способ?

Answer 1

Проще всего было бы масштабировать изображения на сервере и отправлять их в браузер, однако это потребовало бы некоторой серьезной загрузки ЦП на стороне сервера (если только вы не кешируете их, а потом обслуживаете их).Вы можете достичь этого с PHP довольно легко .В зависимости от ваших целей, вы можете просто написать скрипт, который берет все изображения в каталоге, изменяет их размер и сохраняет их в "thumbs /".

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

Answer 2

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

См. http://articles.sitepoint.com/article/image-resizing-php для обучения по изменению размера изображения в php.