- Compressor
- Jpegmini
- ZorroSVG
- Масова або групова оптимізація файлів
- ImageMagick
- Jpegoptim
- Оптимізація PNG (застаріле)
- Оптимізація PNG (нове 2015)
- UPD: Корисні ресурси
Прискорити завантаження сайту можна оптимізувавши екранну графіку, яка використовується на сайті.
У разі, якщо у вас не багато графіки, яку потрібно оптимізувати - можна скористатися он-лайн сервісами, які оптимізують ваші зображення під веб (під оптимізацією я маю на увазі зменшення розміру файлу без помітного погіршення самого зображення тобто без видимих артефактів)
Compressor
https://compressor.io/ - даний сервіс дозволяє зменшити розмір JPG / GIF і PNG зображень он-лайн.
Jpegmini
http://www.jpegmini.com/ - дозволяє судячи з назви зменшити розмір JPG, так-же на сайті можна знайти додаток для Макос і Віндовс, ціна $ 19.99
ZorroSVG
http://quasimondo.com/ZorroSVG/
Ще один чудовий сервіс, який перетворює PNG24 в SVG з прозорістю, але за розміром результату нагадує оптимізований jpg, на жаль теж тільки он-лайн.
Масова або групова оптимізація файлів
Для завдання з уже існуючим довгий час сайтом - он-лайн оптимізатори не підійдуть, на пересохраненіе просто піде дуже багато часу, тому розглянемо варіанти з масовою обробкою файлів.
ImageMagick
http://www.imagemagick.org/
Open Source, безкоштовний, багатоплатформовий пакет програм для обробки графічних файлів без GUI, тобто консольний. Детальніше ознайомитися можна на Вікіпедії .
Власне в Лінуксі і Макос можна встановити за допомогою пакетного менеджера (apt, yum, brew), під виндовс ж треба завантажувати інсталятор.
Приклад використання:
find. -name "* .jpg" -size + 1000k -exec convert -resize 1280x -quality 85% {} {} \;
У поточній директорії знайти всі файли з роздільною здатністю JPG і розміром понад 1000 кілобайт, а потім зробити з ними зміна розміру по ширині в 1280 пікселів і якістю 85% від поточного.
Наприклад ваша папка містить 20 фотографій по 1.3МБ = 26МБ. Застосовуємо конвертер і отримуємо приблизно 8МБ (скоротили витрати місця в 3 рази).
Jpegoptim
Open Source, free, багатоплатформовий оптимізатор зображень і так-же без gui, консольний.
Пакет дозволяє гнучко оптимізувати ваші картинки і прибирати при необхідності метадані, які так-же використовують дорогі вам байти даних.
Доступна в репозитариях пакетних менеджерів Лінукса і Макос Github . Віндовс версія доступна на Sourceforge
Приклад використання:
# M80 - якість від вихідного jpegoptim * .JPG -m80 --strip-all IMG_0165.JPG 1936x2592 24bit N Exiff XMP JFIF [OK] 1985241 -> 724 532 bytes (63.50%), optimized. IMG_1833.JPG 3000x4000 24bit N Exiff XMP JFIF [OK] 2547150 -> 1225657 bytes (51.88%), optimized. ключ -n дозволяє попередньо побачити скільки відсотків від розміру дасть значення -m, (вихідні файли змінені не будуть) jpegoptim * .JPG -m50 --strip-all -n IMG_0165.JPG 1936x2592 24bit N JFIF [OK] 724532 -> 269 481 bytes (62.81%), optimized. IMG_1833.JPG 3000x4000 24bit N JFIF [OK] 1225657 -> 474 300 bytes (61.30%), optimized.
Ну і коли ви вже оптмізіровалі вашу графіку до адекватних розмірів, але хочете ще більшої швидкості вашого сайту - варто задуматися про cdn, але про це вже в наступний раз.
Оптимізація PNG (застаріле)
PNGCrash - неефективний тому повільний і стискає слабо. файл orig - (131.57 KB) вдалося стиснути до pngcrush - розміру (125.04 KB)
for file in $ (find. -name "* .png"); do pngcrush -reduce -brute -rem alla -rem gAMA -rem cHRM -rem iCCP -rem sRGB "$ file" "$ {file% .png} - crushed.png "&& mv" $ {file% .png} -crushed.png "" $ file "; done
Оптимізація PNG (нове 2015)
Для оптимізації під Windows є інструмент Color Quantizer
на сайті приклади вельми непогані - 131 KB до 35,8 KB.
Під Linux є Pngquant
. У мене вийшло вбити приклад з 131 KB до 33 KB пруф: orig - (131.57 KB) after-pngquant - (32.2 KB). Результат значно краще, якщо порівнювати з pngcrush.
find. -name '* .png' -exec pngquant --ext .png --quality = 50-65 {} \;
UPD: Корисні ресурси
комора знань ruhighload - чек листи, інструкції та багато цікавого по темі оптимізації інтернету.
GooglePageSpeed - онлайн перевірка сайту на можливі оптимізації, вказує куди варто звернути увагу при оптимізації.
