6 инструментов для проверки скорости загрузки страниц сайта, и что с этим делать в 2023 году
Я Алексей из loading.express, сервиса, который измеряет скорость загрузки сайтов. В прошлой статье я описал 20 похожих сервисов (~137К просмотров). Обновляю информацию и список инструментов.
Медленный сайт — убийца продаж, конверсий и хорошего настроения
Я возьму два сайта и пошагово покажу какие надо делать замеры. Расскажу, на что смотреть в замерах и что с этим со всем делать.
Важное примечание. Сайт может быть медленным только на смартфоне. Если ваш сайт тормозит на ПК — у вас большие неприятности, потому что на мобилке он может вообще не откроется или будет ронять браузер.
ТОП сервисы для измерения скорости загрузки сайта в 2023 году
- PageSpeed Insights — популярный сервис проверки скорости сайта в мире. Проверяет из США или Европы.
- Loading.express — популярный сервис проверки скорости сайта после PageSpeed. Проверки с серверов Москвы, Новосибирска и Германии. Всего более 20 локаций для проверки.
- Lighthouse 11 — движок от PageSpeed. Это как PageSpeed, только без лишних интерфейсов и из Москвы.
- TTFB — замер скорости ответа сервера в реальном времени. Москва, Новосибирск, Германия и другие города и страны.
- Core Web Vitals — живые данные, напрямую из базы Гугл CRuX.
- Расширение для Chrome или Yandex Browser для проверки в один клик.
Пошаговый план: как измерять скорость загрузки сайта в 2023 году
Итак, возьмем для образца сайт dohome.ru. Покажу на его примере, как сделать всесторонний аудит скорости загрузки сайта.
Как это делаю я:
- открываю сайт, который надо замерить. Жму на кнопку расширения из пункта 6 выше. Делаю замер. Получаю результаты замера;
- анализируем показатели, в первую очередь смотрим на красные и желтые значения;
- далее идем в верхнее меню сайта loading.express. Наводим курсор на «Сервисы». Жмём это.
- Закидываем свой сайт на проверку и ожидаем, пока заполнится данными. Тут важное значение «Median», оно не должно быть выше 0,4.
Важное
Теперь надо проверить Core Web Vitals, что настоящие посетители получают на вашем сайте. Для этого надо получить «живые» данные, которые Гугл заботливо для нас собирает каждый месяц, по каждому сайту, в каждой стране.
Еще важнее. Живые данные относятся ко всем страницам сайта, на которые посетители могут зайти.
Не так давно, 7 февраля 2023, команда Chrome представила CrUX History API, поэтому теперь можно доставать данные Core Web Vitals через API.
Здесь видим такую картину:
Любые замеры сервисами могут показывать что угодно. Ваша задача понять, что сами посетители получают по скорости загрузки.
Что делать со всеми этими замерами
Если вы разработчик, то вы знаете, что делать. Если не совсем, то пишите, проведем обучение.
Если вы владелец сайта или маркетолог, то для вас простые обозначения. Красное убрать. Зеленое добавить. Все красные показатели говорят о том, что норма превышена, а значит с этим надо работать.
Давайте возьмем сайт из свежего рейтинга по ТОПовым медицинским клиникам России и на его примере я покажу, что именно с ним не так и что делать.
Лахта Клиника — 13.165 сек.
Замер на loading.express показывает 2 из 10 баллов.
Что внутри замера.
Время полной загрузки 13.2 секунды.
Число http-запросов — 168, надо до 100. Гугл рекомендует до 50. Это можно сделать путем устранения лишних запросов при загрузке страницы. Запросы — это картинки, стили, скрипты, шрифты и любые ajax-запросы.
Общий размер страницы — 24.41 мегабайта. Вес страницы надо снижать. 71 картинка общим весом в 19.77 мегабайт — серьезная проблема, чтобы быстро загрузить это по медленной сети на смартфоне.
Скрипты весом в 1.74 мегабайта — чистить, отключать, переверстывать без JS.
Шрифты — 10 подключений весом 2.71 мегабайта. Необходимо заменить шрифты ttf на woff2, так как 630 килобайт по три раза совершенно нет необходимости подключать.
Изображения в png формате. Без оптимизации. Гигантского размера. PNG давно никто не использует. Все картинки урезать до необходимого размера, сжать без потери качества и выдавать в формате webp.
Проблемные зоны видны сразу. Здесь собраны все проблемы и с серверной частью и с частью верстки темы сайта. Замерять надо все типы страниц, а не только главную!
Аудит из Lighthouse содержит массу подробных инструкций, с чем работать.
Аудит скорости ответа сервера указывает на то, что сервер не справляется с нагрузкой, которую отдает сайт.
Сложный вариант решения — найти проблемы, создающие нагрузку и устранить их.
Простой, но временный — переехать на более мощный сервер.
Что на самом деле получают посетители этого сайта
Теперь смотрим живые данные. Это те замеры, которые происходят, когда каждый посетитель заходит на сайт из браузера Chrome. В момент открытия сайта браузер записывает все параметры и складывает их в обезличенный отчет.
С этими данными не сможет спорить программист или маркетолог, потому что это статистика от ваших посетителей, с их устройств.
Измерить скорость сайта теперь просто — как ускорить?
Ускорение сайта — это отдельная тема. Здесь нет секретных ингредиентов, но есть свои трюки и наработки.
После ускорения загрузки сайта, я рекомендую провести аудит юзабилити, то есть насколько сайт удобен для посетителя. Для этого можно обратиться ко мне.
Не так давно проводил вебинар у Михаила Шакина, вот нарезки на 2 минуты из него:
Подписывайтесь на канал loading в ТГ.
Увидимся!