WebPageTest

WebPageTest — бесплатный инструмент для тестирования скорости загрузки сайта. Показывает детальный waterfall-график, Core Web Vitals, TTFB и рекомендации по оптимизации производительности.

Кратко

WebPageTest — открытый онлайн-сервис для измерения производительности веб-страниц. Тестирует реальный браузер с реальным соединением, предоставляя waterfall-диаграмму запросов, метрики Core Web Vitals, TTFB, Speed Index и другие показатели загрузки.

Что такое WebPageTest

WebPageTest — бесплатный инструмент с открытым исходным кодом для тестирования скорости загрузки веб-страниц. Разработан компанией Catchpoint. Тестирование проводится с реального браузера (Chrome, Firefox, Edge) из выбранного географического местоположения — это главное отличие от синтетических инструментов.

Результат теста — детальный отчёт: waterfall-диаграмма всех сетевых запросов, метрики Core Web Vitals, filmstrip-просмотр загрузки страницы, скриншоты и видеозапись. Инструмент используют frontend-разработчики и SEO-специалисты для диагностики проблем с производительностью.

WebPageTest позволяет задать throttling соединения (3G, 4G, кабель), устройство (десктоп/мобильный), количество прогонов и первый/повторный визит — это делает тест максимально приближённым к реальным условиям пользователя.

Ключевые метрики WebPageTest

TTFB (Time to First Byte)
Время от запроса до получения первого байта ответа от сервера. Норма: < 600 мс.
First Contentful Paint (FCP)
Время до отображения первого контента на экране. Норма: < 1,8 сек.
Largest Contentful Paint (LCP)
Время до загрузки наибольшего видимого элемента. Хорошо: < 2,5 сек.
Total Blocking Time (TBT)
Суммарное время блокировки основного потока между FCP и Time to Interactive. Коррелирует с INP.
Speed Index
Скорость визуального заполнения видимой части страницы. Чем меньше — тем лучше.
Fully Loaded
Время до полной загрузки страницы, включая все ресурсы.

Waterfall-диаграмма

Waterfall (водопад) — главный инструмент диагностики в WebPageTest. Это временная шкала всех сетевых запросов страницы: HTML, CSS, JS, шрифты, изображения, API-запросы.

  • Каждая строка — один запрос. Цвет показывает тип ресурса
  • Длина полосы — время загрузки. Видны DNS-lookup, TCP-соединение, TTFB, скачивание
  • Параллельные запросы — браузер загружает несколько ресурсов одновременно
  • Render-blocking ресурсы — видны как запросы, блокирующие отрисовку страницы
  • Вертикальные линии — ключевые метрики (FCP, LCP, Load Event)

WebPageTest vs. PageSpeed Insights

ПараметрWebPageTestPageSpeed Insights
Тип тестаРеальный браузерLighthouse (синтетика) + CrUX (поле)
МестоположениеВыбор из 40+ локацийФиксированный
WaterfallДа — детальныйНет
Видеозапись загрузкиДаНет
Core Web VitalsДаДа
ЦенаБесплатноБесплатно
APIПлатныйБесплатный

Как использовать WebPageTest для SEO

  1. Введите URL страницы и выберите тестовую локацию, близкую к вашей аудитории
  2. Задайте реалистичный throttling: 4G для мобильного теста, кабель для десктопа
  3. Запустите 3–5 прогонов для усреднения результата
  4. Изучите waterfall: найдите render-blocking ресурсы, большие JS-бандлы, медленный TTFB
  5. Используйте Opportunities & Experiments — встроенные советы с оценкой эффекта
  6. Сохраните URL результата: он постоянный, удобен для сравнения до/после

Частые вопросы

WebPageTest тестирует реальным браузером, показывает waterfall и видеозапись загрузки. PageSpeed Insights запускает Lighthouse (синтетика) и дополнительно показывает реальные данные из Chrome User Experience Report. Для диагностики конкретных проблем WebPageTest информативнее.
После каждого значительного изменения (редизайн, новые скрипты, смена хостинга). Для мониторинга — еженедельно или через API/CI-интеграцию при каждом деплое.
Да. Выберите 'Moto G (gen 4)' как устройство и 4G throttling. Это стандартная конфигурация для проверки мобильной производительности, максимально близкая к условиям реального пользователя.
Встроенная система рекомендаций, которая автоматически предлагает оптимизации с оценкой ожидаемого прироста LCP и других метрик. Есть режим 'Experiments' — WebPageTest применяет оптимизацию и сразу показывает результат без изменения кода.
Прямые контакты

Обсудим ваш проект?

Расскажите о целях и сайте — предложу формат работы и следующий шаг.