Полупрозрачный JPG

Попался мне на глаза достаточно интересный способ значительно уменьшить размер большого полупрозрачного PNG.
Начнем с примера.  PNG – 334Кб, aJPG – 74 Кб.
Суть приёма в следующем.
<!--more-->

Раскладываем оригинальный PNG:

на две картинки, первая – jpg файл основного изображения:

и PNG маски прозрачности  -

Затем во время загрузки старицы динамически создаем canvas с jpg содержимым и на него накладываем маску.

Разумеется работать это будет при соблюдении двух условий: включенного js и поддержки браузером canvas.

Пример
Источник.




Share this story