Ракетная скорость сайта

Сегодня решил поделиться собственным опытом, как можно максимально просто ускорить скорость загрузки своего сайта.

Мое достижение в этом, 100 из 100 в GTmetrix, на одном из моих проектов (это очень круто).

Готовы к оптимизации? Погнали.

Зачем нам вообще надо заниматься оптимизацией скорости?

По данным Akamai, сайты теряют ~ 40% посетителей, если он загружается дольше 3 секунд. Да, мы понимаем что Akamai, выгодно писать большие цифры потери конверсии, но факт, что сайты теряют посетителей, при «не комфортной» загрузке страницы — реален.

Вы наверняка чувствовали растущее раздражение, когда сайт грузится медленно.

Какие есть инструменты, для тестирования скорости сайта?

Я использую 3 инструмента, чтобы выяснить слабые места сайта:

1. GTmetrix — мой основной инструмент, наиболее удобный на мой взгляд. Особое внимание надо уделить страницы Waterfall, именно там видно, на что уходит больше всего времени по загрузке. Если зарегистрироваться, то у нас будет удобная история скорости загрузки сайта;
2. Tools Pingdom — вспомогательный инструмент. Очень удобно показывает нам, где именно основной затык по скорости загрузки;
3. Google Page Speed — использую редко т.к. первые 2 базируется в т.ч. на его оценке.

Ок, мы протестировали наш сайт, что делаем дальше?

Ну дальше, делаем что ниже описано, по убывающий, он наиболее эффективного:

1. Подключаем сайт к CDN Cloudflare, по бесплатному тарифу. Кстати, к CMS WordPress есть хороший плагин — Super Page Cache for Cloudflare.
2. Включаем кэширования. Я использую связку FastCGI + Redis, на сервере Linux с Webinoly (подробнее тут).
3. Отключаем все лишние метрики. Я пожертвовал Яндекс метрикой и Google аналитикой, т.к. они хорошо влияют на загрузку сайта и заменил их self-hosted метрикой от Matomo (ссылка будет позже). Она лучше хотя бы тем, что не сливает данные пользователей. Да, мои проекты еще и безопасные.
4. Уменьшаем вес изображений. Как это сделать наиболее эффективно, описано в статье (подробнее тут).
5. Включаем Lazy Load Images — загрузка изображений по мере отображения их в видимой части, для пользователя. Для CMS WordPress, есть чудный плагин Clearfy. В котором это включается галочкой.
6. Используем картинки в JPEG, а не PNG на сайте. Еще лучше — перейти на WebP, я вот еще не перешел 🙂
7. Включаем gzip сжатие на сервере. Если он еще не включен у вас.
8. Отключаем все лишние плагины (это для CMS). Плагины создают запросы, запросы увеличивают скорость загрузки сайта.
9. Убираем все лишнее со страницы, то что не нужно пользователю.
10. Чистим базу MySQL от мусора и мертвой информации. База со временем сильно разрастается, поэтому очищение, становится необходимостью.

В основном ответы на все пункты хорошо можно найти самостоятельно в поиске. Я лишь указал направление по оптимизации сайта и поисковые запросы. Подробнее описывать не вижу особого смысла, вся информация доступна в сети. Если у вас есть вопросы — пишите в комментариях.

Если хотите чтобы я сделал аудит вашего сайт и провел оптимизацию скорости загрузки, пишите через контакты. Всем спасибо за чтение 🙂