Фотографии закладок скорости

Купить Здесь

С его помощью меньше чем за минуту можно получить подробный отчет о производительности Web страницы. В подавляющем большинстве случаев PageSpeed подскажет, что нужно оптимизировать графику. Это наиболее частая проблема и наиболее весомая. Чем меньше весят фотки — тем быстрее грузится сайт. Меньше картинки — меньше трафика — все работает быстрее. Посетители тратят меньше времени — все довольны. В этом материале подобраны основные инструменты для оптимизации графики. Серверные инструменты Самые частые — изображения в формате JPG. Jpegtran сжимает картинки без потерь и удаляет метаданные: Утилита convert позволяет указывать параметр качества для сжатия, что поможет уменьшить размер картинки: Основной алгоритм работы — уменьшается количество используемых оттенков цветов. Это снижает размер с небольшими потерями в качестве: Использует алгоритм сжатия без потерь: Создатели заявляют, что могут сжать некоторые изображения в 5 раз без потерь в качестве. Есть API для автоматизации. Реально крутой инструмент оптимизации для PNG. Очень хорошее сжатие без заметных потерь в качестве. Также есть API и большой бесплатный пакет. Простой сжиматор, работает с любым форматом. Удобен для одноразовой обработки. Модуль PageSpeed Google потрудился и выпустил модуль к Ngnix и Apache для повышения производительности сайтов. Он увеличивает скорость загрузки, оптимизируя дофига всяких параметров , в том числе и фотки. Работает автоматически, его нужно только установить и включить: Например, пережимает картинки или минифицирует статику. В исходниках страницы все оптимизированные ресурсы будут иметь другой путь. Прямая оптимизация ресурсов После оптимизации PageSpeed сохраняет файл по новому пути. Но как быть с фотками, отображаемыми через JavaScript? Или со ссылками на Ваши фотки на сторонних ресурсах? Для этого достаточно включить в конфиг такие инструкции для Nginx: Если графики много, используйте серверные инструменты для оптимизации: Облачные инструменты для одноразовых задач и подключения по API: Есть ещё -strip для ImageMagick-овского convert. А еще ImageMagick умеет устанавливать разный color subsampling при кодировании, сменив который со стандартного 4: Как то вы совсем по вершкам прошлись. Нету описания svgo, pngout, gifsicle, advpng. Нету ссылки к очень популярному ImageOptim. Последний раз когда использовал pagespeed с nginx, было много заморочек c https. Еще есть optipng, который проще использовать, чем pngcrush, и сжимает сильнее. Чем Imagemagick так лучше gd, что про один рассказано, а про второй — нет? Представьте ситуацию когда десяток пользователй грузят равы по 50 мегабайт. Образно — сравнивать imagemagick и gd это как сравнивать болид формулы один с окой. Модуль pagespeed для nginx действительно может помочь со скоростью загрузки сайта, но может вдвое увеличить нагрузку на cpu. Сейчас не смог найти ничего похожего в рекомендациях и гугла, и яндекса. Как сейчас с этим обстоит дела? В метаданных еще и копирайт указывается и дата съемки, нужно ли их удалять? Google умеет искать по EXIF, так что теоретически его можно использовать для продвижения. Хотя речь скорее всего идет об alt. Вот что я имею в виду. Тоже самое и про яндекс нашел. На Хабре уже было множество содержательных статей в том числе — в формате обзорных по оптимизации графики, например, вот такая. Эта существенно от них отстает по качеству. Видимо, это потому что мы жалеем новичков, которые неделю на Хабре, и не сливаем их как в старые добрые времена. Важная ремарка — все это имеет смысл в первую очередь тогда, когда изображения напрямую грузятся посредством тега img или background. При той же lazy load загрузке изображений, подобного рода приемы уже не так критичны, хотя, конечно, и важны. Еще момент, если нуно пожать картинки на локалке, то можно использовать ' FileOptimizer '. Игрался с этими штуками так и не смог приблизиться к результатам этой штуки — compressor. Он жмёт с потерями, иначе такого результата не добиться. Проверял оба режима, что Lossy, что Lossless выдают одинаковый результат. Ну ведь совсем ни о чем пост. Зачем программы, когда гугл сам предлагает скачать у него же со страницы отчета оптимизированные картинки? Сжимать jpeg тем интересно, что и второе, и третье, и прочие сжатия даже с теми же параметрами как бы дадут уменьшение размера файла. Не сильно, но сожмут. Другое дело, что качество картинки будет потеряно, и раз за разом будет падать. А уж модулю Pagespeed доверять в том, что он все сам сделает — можно, но с опаской. Ну и не надо забывать, что у этого модуля страница может запрос от запроса получаться в виде кода другого вида, а это может иметь и дальнейшие последствия. Не статья, в общем, а грусть на грусти. Jpegtran сжимает картинки без потерь На картинке-примере после этой операции чувак потерял полпальца и взгляд перевел на эту потерю. Неудачная иллюстрация сжатия без потерь. Сутки Неделя Месяц У вас есть синдром ученика? Вы уволили самого талантливого сотрудника. Интересные публикации Хабрахабр Geektimes. Главы 7, 8, 9, 10 GT. Дайджест интересных материалов для мобильного разработчика 30 октября — 5 ноября. Инверсия зависимостей в мире фронтенда. Никто не знает, куда девается информация из чёрных дыр GT. Поприветствуем наших новых хозяев — роботов — глава вторая GT. Почему визуальное программирование и D3NE могут быть Вам полезны. У вас есть синдром ученика? Услуги Реклама Тарифы Контент Семинары.