Оптимизация сайта под PageSpeed



Здесь буду записывать особенности оптимизации сайта под требования PageSpeed.
Важно понимать, что если каждый отдельный виджет, блок кнопок, счётчик отнимает 2-3 балла, то если их поставить вместе - то сразу минус 30 баллов. Поэтому обычный сайт текст + картинки даже с установленной Метрикой может вполне показывать 96 баллов. 
Из того что заметил: обычный блог Wordpress без счётчиков, виджетов, кнопок и прочих внешних скриптов даёт 100 баллов даже без Lazy Load. Смотрите выше скриншот. Это показатели обычной статьи с  картинками: 1 в начале и 5 в конце страницы (Важно! они вне первого экрана). Т.е. изначально WP без проблем проходит все тесты.

Влияние виджета Вконтакте (-28 баллов)

Добавление обычного виджета группы, типа такого, сразу снижает попугаи до 73-75:

Добавление асинхронного виджета Вконтакте (библиотека CondiLoader) (-1 балл)

Идея взята отсюда http://4xpro.ru/profblog/async_widgets-1/
Работает отлично. Не нагружает.





Добавление кнопок AddtoAny (-3 балла)

Кнопочки генерируем здесь https://www.addtoany.com/buttons/for/website. Обычный набор для рунета: ОК, ВК, Фб и т.д.

Добавление Яндекс.Метрики (-2 балла)

Новый код Яндекс.Метрики сильно тормозит страницу. Если использовать старый + через CDN (для жителей Украины), то можно значительно снизить время загрузки. 

Заходим в Метрику и выбираем:
  • Альтернативный CDN
  • Устаревший код счетчика
  • Асинхронный код


В полученном коде удаляем в конце всё что между <noscript></noscript> - это картинка, для тех кто отключил в браузере JS и она ни на что не влияет.





Комментарии