Рубрики
Live

108: проверить скорость сайта с WebPageTest 2020

В этом видео вы узнаете почему WebPageTest хороший инструмент для проверки скорости сайта. Как им правильно пользоваться. Какие настройки надо активировать и что именно смотреть в аудите для анализа скорости сайта.

Проверьте скорость сайта из Киева сейчас:

108: Проверка скорости загрузки через WebPageTest 2020 Август
Watch this video on YouTube.

Временные метки для видео:

  • 0:00 – Музыкальное приветствие наших зрителей! Мы начинаем
  • 7:10 — Демонстрация работы с сервисом WebPageTest, настраиваем параметры поиска
  • 9:30 – Интерфейс сервиса: адрес сайта, локация проверки, тип браузера
  • 10:50 – Настройки теста: скорость соединения, количество замеров, запись теста, тип повтора теста (с кэшем/без)
  • 13:40 — Расширенные настройки: отключить JavaScript, очистить SSL кэш, игнорировать сертификат SSL и т.д.
  • 14:50 – Настройки браузера Chrome: Lighthouse отчет, DevTools Timeline и другие параметры
  • 16:27 – Вопрос из зала: «Почему не обязательно эмулировать мобильный браузер?»
  • 16:59 – Как проверить новую не опубликованную версию сайта с изменениями
  • 19:30 – Разбор результатов тестирования Web Page Performance Test, подробно – 26:45
  • 20:40 – Что главным образом повлияло на оценку
  • 26:10 – Ответ на вопрос: «Мне lighthouse вывел оценку 32, а в PageSpeed Insights 65. Чудеса, с которыми нужно разобраться»
  • 26:45 – Продолжение разбора отчетов по тесту на WebPageTest: XSS уязвимость, версия JavaScript библиотек
  • 27:10 — Отчет по First Byte Time (Время первого ответа)
  • 27:33 – Репорт по Keep Alive (Разрыв соединения/ответа). Немного о стороннем сервисе CDN Callibri, подробнее – 29:07
  • 28:14 – Результат тестирования по кэшированию
  • 29:33 – Обобщенный анализ сайта с суммарной оценкой показателей скорости
  • 30:18 – Вопрос из зала: «Это отчет lighthouse из webpagetest?»
  • 31:15 – Кратко о показателях: время полученного первого байта (First Byte), первая прорисовка (Start Render), прорисовка визуального контента (First Contentful Paint — FCP), скорость прорисовки (Speed Index), полная погрузка экрана (Last Painted Hero)
  • 32:00 – Web Vitals: LCP (Largest Contentful Paint – время до отрисовки самого большого содержимого), CLS (Cumulative Layout Shift — нестабильность контента), TBT (Total Blocking Time – общее время блокировки)
  • 32:22 – Стандартные метрики загрузки документа (Document Complete ) и полной загрузки (Fully Loaded)
  • 33:23 – Объясняем результаты Waterfall отчета во временных рамках
  • 38:33 – Что говорит разделение по зонам в показателях Page is Interactive, подробнее – 50:00
  • 39:00 – Комментарий из зала: «Желтая подсветка для строк, значит есть замечания у сервиса?»
  • 39:26 – Детализация запросов: тип данных, начало запроса, время проверки SSL/установления соединения/DNS обращение
  • 40:30 – Заголовки по каждому запросу и детали запроса
  • 41:07 – Performance Review, суммарный чек-лист: отсутствие CDN, кэширование, сжатие
  • 41:55 – Отрицательная оценка теста: неиспользование CDN, насколько это важно
  • 42:23 – Легче анализируется детализация оценки по параметрам или суммарная оценка
  • 44:14 – Content Breakdown по двум типам: по запросам и переданным байтам. Подробнее об uncompressed data (несжатые данные) – 45:00
  • 45:43 – Отчет по доменам, с которыми устанавливается соединение
  • 47:21 – Основной поток (Main-thread processing breakdown) и его процессы. Сколько времени занимает определенные категории данных
  • 50:00 — Какие значения допустимы по блокировке главного потока (Page is Interactive)
  • 52:00 – Рассматриваем и разбираем скриншот-отчеты, видеоотчеты – 53:50
  • 58:27 – Lighthouse 6 от LOADING.express – сервис для замера скорости сайта также создает видеоотчет. Проверить можно по ссылке https://lh6.loading.express/
  • 1:03:20 – Заключение из выпуска о WebPageTest, как о сервисе с самым развернутым и детальным отчетом по замеру скорости загрузки сайта
  • 1:06:30 – До следующего эфира!

Выводы про WebPageTest:

Сервис отличный. Современный и мощный. Так как последнее время разработчик этого сервиса не старается расширять географию проверок, то России в проверках нет.

После внедрения Web Vitals от Google — эти замеры появились в WPT. В нем есть видео загрузки сайта и сохраняется замер по ссылке, чтобы можно было сравнить до и после.

Кроме этого, есть замеры с мобильных устройств и форум, где можно задать вопрос и получить квалифицированный ответ от экспертов.

Автор: Алексей

Маркетолог в ax.digital и в loading.express. Трехкратный отец.