Сайт открывается 4 секунды, и посетитель ушёл. Знакомая ситуация?

По данным Google Research за 2023 год, вероятность отказа растёт на 32% при увеличении загрузки с 1 до 3 секунд. Одна из главных причин тормозов, которую часто пропускают, избыточные HTTP-запросы. Они не бросаются в глаза как тяжёлые картинки или кривой хостинг, но набираются десятками и в сумме съедают секунды.

Разберём, что это за запросы, как их найти через waterfall-анализ в GTmetrix и, самое главное, как сократить их количество без вреда для функциональности сайта.

💡 Быстрый обзор:

• Открываете GTmetrix, вставляете URL сайта и переходите во вкладку Waterfall, видите каждый запрос с его размером и временем загрузки
• Фильтруете запросы по папкам plugins и themes, находите плагины, которые тянут скрипты на всех страницах без необходимости
• Проходите по 5 точкам: лишние изображения, необъединённые CSS/JS, плагины с глобальной загрузкой, тяжёлые плагины и отсутствие ленивой загрузки
• После правок запускаете тест повторно и сравниваете количество запросов «до» и «после»

Что такое HTTP-запросы и почему они тормозят сайт

Когда браузер открывает страницу, он не получает готовую картинку целиком. Ему нужен HTML-каркас, файлы стилей, каждый из скриптов, шрифты, изображения, и для каждого элемента браузер отправляет отдельный HTTP-запрос к серверу.

Часть запросов уходит на ваш сервер (внутренние: картинки из медиатеки, тема, плагины). Часть, на внешние сервисы (Google Analytics, YouTube-встройки, скрипты рекламы). Браузер выстраивает их в очередь и грузит.

Зависимость простая: больше запросов, дольше загрузка. Но не все запросы равны. Крошечный скрипт отслеживания загружается за 20 мс, а неоптимизированное изображение на 500 КБ может висеть полсекунды. Поэтому задача не просто «сократить количество», а убрать ненужные и облегчить оставшиеся.

На практике разница заметна: сайт-портфолио на чистой теме делает 18 запросов и открывается мгновенно. Крупный новостной портал вроде New York Times, за 200 запросов, половина из которых скрипты рекламы и трекинга. Ваш сайт, где-то посередине, и это число можно уменьшить.

Как анализировать HTTP-запросы: waterfall в GTmetrix

Самый наглядный способ увидеть HTTP-запросы, waterfall-диаграмма (каскад). Она показывает каждый запрос отдельной строкой: откуда, сколько весит, когда начал грузиться и сколько занял.

Инструменты, которые умеют waterfall:

• Встроенные Chrome DevTools (вкладка Network), бесплатно, но только для вашего браузера
• GTmetrix, бесплатный тариф, тест с разных локаций, понятный интерфейс
• Pingdom Tools, похож на GTmetrix, другие точки тестирования
• WebPageTest, максимум деталей, но сложнее для начала

Разберём на примере GTmetrix. Вставляете URL, запускаете тест. В результатах вкладка Waterfall, она и есть каскад:

Сама диаграмма выглядит так:

Что означают столбцы:

• URL, путь к файлу. По нему видно, какой плагин или тема добавили запрос
• Домен, ваш сервер или внешний. Сразу видно, сколько грузится со стороны
• Размер, вес файла. Тяжёлые запросы бьют по скорости сильнее
• Временная шкала, когда начался запрос и как долго длился. Важен не только размер, но и положение: файл в начале цепочки блокирует всё, что идёт за ним

Нажмите на поле поиска над диаграммой и введите wp-content/plugins, увидите только запросы от плагинов. На примере ниже плагин Lightweight Social Fonts добавляет запрос шрифта fontello.woff на 22,9 КБ:

А если отфильтровать по themes, увидите запросы темы. GeneratePress, например, отдаёт всего 4 запроса, это хороший показатель для лёгкой темы:

Пройдитесь по списку и задайте себе вопрос: «Этот плагин правда нужен на каждой странице?» Часто ответ, нет. Дальше разберём, что с этим делать.

5 способов сократить HTTP-запросы в WordPress

После waterfall-анализа у вас на руках список запросов. Теперь, конкретные шаги для сокращения.

1. Убрать лишние и неподготовленные изображения

Каждое изображение = один HTTP-запрос. Если на странице 15 картинок, и 5 из них декоративные или дублирующиеся, это 5 запросов, которые можно убрать без потери смысла. Для обязательных изображений правило другое: сжать и подогнать под размер отображения. Картинка 2500px, вставленная в блок шириной 700px, грузит в 5 раз больше данных, чем нужно.

На практике помогает связка: ручная ревизия (убрать ненужное) + плагин сжатия. Среди актуальных вариантов, ShortPixel, Imagify, Smush. Они сжимают изображения при загрузке в медиатеку и могут пережать существующие.

2. Объединить CSS и JavaScript

Тема и каждый плагин добавляют свои файлы стилей и скриптов. Если у вас активная тема, 10 плагинов и пара внешних сервисов, легко набирается 30-40 отдельных CSS/JS-файлов. Каждый из них требует отдельного HTTP-запроса.

Техника называется конкатенацией (объединением) и обычно идёт в паре с минификацией, удалением пробелов и комментариев из кода. Большинство плагинов производительности делают и то, и другое:

• WP Rocket, премиум-плагин, объединяет и минифицирует CSS/JS в пару кликов
• Autoptimize, бесплатный, только конкатенация и минификация

Важно: после включения объединения пройдите по основным страницам сайта и убедитесь, что вёрстка не поехала. Иногда скрипты конфликтуют при склеивании, тогда конкретный файл исключают из объединения.

3. Запретить плагинам грузиться где не нужно

Контактная форма стоит только на странице контактов. Но её CSS и JS часто грузятся на всём сайте, это 2-3 лишних запроса на каждой странице без формы. Contact Form 7, например, по умолчанию загружает скрипты глобально.

Если плагин это допускает, есть два пути:

• Заменить на более оптимизированный аналог, который не грузит ресурсы глобально
• Оставить плагин, но управлять загрузкой скриптов через Perfmatters, в нём есть менеджер скриптов, позволяющий отключить CSS/JS плагина на всех страницах, кроме тех, где он реально используется

Результат: те же 2-3 запроса, но только на одной странице контактов, а не на всём сайте.

4. Заменить тяжёлые плагины на лёгкие аналоги

После waterfall-фильтра по plugins вы видите, какие плагины генерируют больше всего запросов. Если один плагин добавляет 8 скриптов и стилей, а его аналог обходится двумя, замена сокращает 6 HTTP-запросов.

Примеры замен из практики:

• Слайдер Revolution Slider (тяжёлый) → лёгкий блок обложки из темы или MetaSlider
• Конструктор страниц с десятками скриптов → нативный редактор блоков Gutenberg
• Плагин соцсетей с внешними запросами к API → статичные иконки ссылок

Проверьте каждый плагин из waterfall-списка: используется ли он вообще? Если плагин не обновлялся больше года или функциональность не нужна, удалите полностью.

5. Включить ленивую загрузку

Ленивая загрузка (lazy loading) откладывает загрузку изображений и iframe, которые находятся ниже видимой области экрана. Посетитель открывает страницу, грузится только то, что он видит. Остальное подтягивается по мере прокрутки.

С WordPress 5.5 атрибут loading="lazy" добавляется к изображениям автоматически. Этого достаточно для базового сценария. Если нужна более агрессивная ленивая загрузка (для iframe, фоновых изображений, видео), используйте Perfmatters, WP Rocket или бесплатный LazyLoad by WP Rocket.

Видео: HTTP-запросы WordPress за 5 минут

Короткое видео по теме, от диагностики до сокращения запросов без плагинов:

⁉️🤔 Частые вопросы

Сколько HTTP-запросов, норма для WordPress?

Универсального числа нет. Чистый сайт на лёгкой теме с 5-7 плагинами укладывается в 25-40 запросов. Сайт с конструктором страниц, рекламными скриптами и десятком плагинов может делать 80-120. Ориентируйтесь не на абсолютное число, а на динамику: было 90, стало 55, это хороший результат.

Влияют ли внешние запросы (Google Fonts, Analytics) на скорость?

Влияют, но иначе. Внешний запрос к Google Fonts добавляет 1-2 запроса, но они идут через CDN Google и грузятся быстро. Главная проблема, блокировка рендеринга: пока шрифт не загрузится, браузер может не показывать текст. Решение: предзагрузка шрифтов через preload или хостинг шрифтов локально.

Обязательно ли объединять все CSS и JS в один файл?

Не всегда. Объединение всех скриптов в один файл даёт один запрос, но большой файл грузится дольше. Современный HTTP/2 умеет загружать несколько файлов параллельно, поэтому 3-4 файла по 30 КБ могут загрузиться быстрее, чем один на 120 КБ. Оптимально объединять критический CSS (тот, что нужен для отрисовки первого экрана) и оставлять некритические скрипты отдельно с атрибутом defer.

Что делать, если после объединения CSS сломалась вёрстка?

Исключить проблемный файл из объединения. WP Rocket и Autoptimize позволяют добавить URL скрипта или стиля в список исключений. После этого запустите тест заново, потеря одного файла из пула в 15 запросов почти незаметна.

Можно ли сократить запросы без плагинов?

Можно. Ручное deregister-ование скриптов через functions.php даёт полный контроль, но требует понимания WordPress-хуков. Для большинства владельцев сайтов WP Rocket или Perfmatters проще и безопаснее: они не дадут отключить критичный для работы скрипт.

Пора навести порядок в запросах

HTTP-запросы, не та вещь, которую чинят один раз. Поставили новый плагин, сменили тему, добавили рекламный скрипт, появились новые запросы. Раз в пару месяцев заходите в GTmetrix, открывайте Waterfall и сверяйтесь с тем, что было в прошлый раз.

Если прямо сейчас не знаете, сколько запросов делает ваш сайт, откройте GTmetrix, вставьте URL и нажмите «Start Test». Через минуту увидите реальную картину. А дальше, по шагам из статьи. Каждый убранный запрос приближает сайт к загрузке за 1-2 секунды.