Здравствуйте. На этой неделе к нам поступило обращение с просьбой оптимизировать сайт PageSpeed Insights. Наша цель загнать сайт в средние показатели. От 50 до 89.
Честно, мы не занимались этим очень при очень давно, так как сам PageSpeed выдавал такой бред и большинство что он писал было неверно.
Но так как Google обновил ранжирование и стал более гибким, были изменения и в самом PageSpeed. Я решил взять этот проект и постараться оптимизировать сайт, как ни как это дополнительно поможет вспомнить, то где меня давно не было. :)
Я буду оптимизировать сайт во время написания статьи.
Ну что же приступим к оптимизации?
Пойдем по порядку.
1. Определим на чем написан сайт.
2. Посмотрим какие ошибки нам выдаст PageSpeed.
Сайт написан на CMS платформе WordPress. Это на много упрощает работу, так как есть множество плагинов которые помогут нам с оптимизацией.
Смотрим ошибки которые блокируют скорость загрузки сайта.
Посмотрев на ошибки мы уже понимаем, что мешает быстрой загрузки.
Первым делом делаем Бекап базы данных и самого сайта!
Установим плагин Autoptimize ну и конечно же постараемся его оптимально настроить, я не буду расписывать все что связано и не связано с настройками, так как у каждого сайта свое и тут нужно тщательно читать и проверять все что вы делаете и где ставите, что нужно оптимизировать. После поставленных Вами настроек обязательно проверяем сайт на работоспособность, в моем случае "Объединить все связанные JS-файлы для их неблокируемой загрузки? " слетают JS файлы и сайт криво начинает отображаться это мне не подходит. "Объединить все связанные CSS-файлы?" Так же привело к краху сайта. Остальные настройки работают на Ура!
Продолжаем, устанавливаем плагин WP Rocket. И настраиваем его. Настройки все установил, вроде все работает хорошо. Продолжаем работать.
Устанавливаем плагин Clearfy Pro. Ну и конечно же настраиваем. Включаем все что рекомендовано и смотрим дополнительные поля, которые нам необходимы.
Не забываем проверить работу сайта!
У меня сайт работает в штатном режиме, я замечаю уже какой ни какой плюс, теперь давайте проверим еще раз наш сайт на PageSpeed Insights.
Неплохой результат, но этого мало, нужно еще что то придумать и доделать, продолжаем смотреть, что же у нас мешает загрузки сайта.
Пойдем по порядку, оптимизируем изображения на сайте. Оптимальные картинки это размер 800*600px, но есть же и фоновые картинки, что с ними можно сделать? Мы его превратим в WEB формат или просто сжать с помощью Photoshop.
Картинок очень при очень много, каждую редактировать и преобразовывать, это займет ни 1 день работы, нужно поискать альтернативный и эффективный вариант, посмотрим что же есть в плагинах, он должен быть уже 100% написан одним из таких же ленивых как я людей, дабы упростить свое драгоценное время.
Но прежде чем мы пойдем оптимизировать картинки, давайте уберем лишние запросы от сайта, под лишним я имею введу счетчики установленные на сайт, они не нужны.
Пояснение:
Прежде чем загрузить сколько посетителей к Вам заходило на сайт, с самого сайта идет GET запрос к стороннему ресурсу и в ответ получает POST запрос для отображения количества посетителей, таким образом мы нагружаем сайт как минимум двумя запросами, которые в свое время так же требуют время на обработку.
Приступим к самим картинкам!
И так я 2 раза сломал сайт, пробуя разные оптимизаторы и плагины. Но я все же нашёл в полне рабочий плагин. Robin imagе optimizer. Очень прост в работе и на удивление действительно оптимизирует.
Ну что же самое основное оптимизировано пора посмотреть на результат!
Ну что же, мы добились нужного результата. Проверяем сайт на быстродействие.
Проверю еще для себя скорость загрузки на сайтах pingdom и pr-cy, ну прям кажется мне, что этот PageSpeed выдает бред.
И так скорость загрузки 1,89 секунд. Жаль что перед самым началом я не проверил эти показатели, сейчас очень сожалею об этом.
Ждем Ваших комментариев, подписывайтесь на канал, ставьте лайки.
Дальше будет интереснее.