Как ускорить WordPress до 90+ в PageSpeed: пошагово без магии

В 2025-м зелёные показатели PageSpeed (особенно Mobile) — это про дисциплину и правильный порядок работ. Ни «секретных кнопок», ни «чудо-плагинов» не существует: высокие баллы — результат системной оптимизации под Core Web Vitals: LCP (главная видимая загрузка), CLS (стабильность верстки) и INP (вместо устаревшего FID — отзывчивость на взаимодействия). Ниже — пошаговый план, который последовательно закрывает узкие места WP-стека.

Карта работ (что и в какой очередности делать)

1. База: хостинг и сервер →
2. Кодовая база: тема/плагины →
3. Кэш: страничный + объектный →
4. Статические ресурсы: CSS/JS/шрифты/картинки →
5. Критический рендер: LCP/CLS/INP →
6. Сеть: CDN/HTTP/3 →
7. Контент и интеграции →
8. Финальная шлифовка и мониторинг

Дальше — детально по каждому шагу.

1) База: хостинг и сервер (TTFB — фундамент)

• • PHP 8.2+, OPcache включен (оптимально: opcache.enable=1, opcache.memory_consumption=256, opcache.max_accelerated_files=100000).
  • PHP-FPM (pm = dynamic или ondemand) и HTTP/2/HTTP/3 на фронте.
  • Nginx как reverse-proxy + Brotli (или хотя бы Gzip).
  • MariaDB 10.6+/MySQL 8+, с настроенными буферами (query cache не нужен).
  • Redis для object cache.
  • Географически близкий дата-центр к аудитории.

Если хостинг на LiteSpeed — используйте плагин LiteSpeed Cache (он объединяет почти всё, что ниже).

2) Кодовая база: тема и плагины (срезаем жир до оптимизации)

• Выберите лёгкую тему (Astra, GeneratePress, Blocksy, Kadence) и держитесь подальше от «комбайнов», если нет жёсткой необходимости.
• Удалите каждый плагин, который:
  • дублирует функциональность другого,
  • грузит фронт (особенно визуальные билдэры с тяжёлыми бандлами),
  • вставляет внешние виджеты/трекеры без реальной пользы.
• Отключите «всё для всех»:
  • локально ограничивайте CSS/JS на нужных страницах (плагины типа Asset CleanUp, Perfmatters помогают точечно разгружать фронт).

3) Два кэша: страничный + объектный

Страничный кэш (full page cache):

• Варианты: LiteSpeed Cache, WP Rocket, Nginx FastCGI Cache, Cloudflare APO.
• Исключите персональные/динамические страницы из кэша: /cart/, /checkout/, /my-account/, страницы поиска и т. п.

Object cache:

• Redis Object Cache (persistent) заметно разгружает БД на высоком трафике/каталогах.

4) Статика: стили, скрипты, шрифты, изображения

CSS/JS

• Defer/async для не-критичных скриптов, delay JS до первого взаимодействия, inline critical CSS (у многих кеш-плагинов есть автогенерация).
• Remove unused CSS/JS там, где возможно (особенно на лендингах).
• Минификация и объединение — с умом: с HTTP/2/3 лучше много маленьких, чем один гигантский, но полезно убирать «мусор».

Шрифты (частая причина плохого LCP/CLS/INP)

• Самохост: конвертируйте в .woff2, подключайте локально.
• Укажите font-display: swap;.
• Предзагрузите ключевые гарнитуры:

<link rel="preload" as="font" type="font/woff2" href="/fonts/Inter-regular.woff2" crossorigin>

• По возможности — системные шрифты (мгновенный рендер без FOIT).

Изображения

• Форматы WebP/AVIF (поддержка в ядре WP уже есть; на проде удобно плагинами: ShortPixel, Imagify, EWWW).
• Responsive images: srcset/sizes, реальная ширина под макет (никаких 4000px в превью).
• Lazy-load всех below-the-fold (WP делает это нативно, но видео/iframes — через плагин).
• Preload LCP-картинки (герой/баннер выше сгиба):

<link rel="preload" as="image" fetchpriority="high" imagesrcset="/img/hero-768.webp 768w, /img/hero-1280.webp 1280w" imagesizes="100vw" href="/img/hero-1280.webp">

5) Критический рендер: закрываем LCP/CLS/INP

LCP (Largest Contentful Paint)

• Сделайте LCP-элемент простым и лёгким: обычно это герой-картинка/заголовок.
• Preload LCP-картинки и inline critical CSS.
• Сократите блокирующий JS (особенно A/B, виджеты чатов, внешние трекеры).

CLS (Cumulative Layout Shift)

• Всегда фиксируйте размеры медиа:

<img src="/img/card.webp" width="640" height="360" alt="..." />

• Резервируйте место под рекламные/виджетные блоки.
• Не грузите шрифты с «прыжком» — font-display: swap, подгоняйте fallback-гарнитуру по метрикам.

INP (Interaction to Next Paint)

• Уменьшайте тяжёлые слушатели и таски в главном потоке (разгрузка JS, делегирование событий).
• Откладывайте неважные скрипты до user-interaction или до requestIdleCallback.
• Минимизируйте DOM-перестройки (аккуратный lazy-render блоков ниже сгиба).

6) Сеть: CDN, протоколы и политика соединений

• CDN (Cloudflare, Bunny, CloudFront) для картинок, видео, статики. На мобильном трафике география решает.
• Включите HTTP/3 (QUIC) на фронте.
• Декларативные подсказки:

<link rel="preconnect" href="https://static.example-cdn.com" crossorigin>
<link rel="dns-prefetch" href="//static.example-cdn.com">

• Стриминговые/внешние скрипты подключайте условно и на нужных страницах.

7) Контент, виджеты, интеграции

• Внешние виджеты (чат, аналитика, карты, соц-плагины) — только где реально нужны. Остальные — по клику (lazy-hydrate).
• Видео — через постер + lazy iframe или lite-youtube-embed.
• Формы — минимизировать поля, антиспам без тяжёлых скриптов (hCaptcha «invisible» → грузить после взаимодействия).

8) Финишная шлифовка и мониторинг

• PageSpeed Insights: прогоняйте отдельные ключевые страницы (главная, карточка услуги/товара, блогпост).
• Разделяйте Lab и Field: Лаб-оценка поможет найти блокировки рендера; Field (данные реальных пользователей) подтянется после деплоя.
• WebPageTest/Lighthouse в CI — для регрессионного контроля.
• Server logs/Cloudflare Analytics — следите за кэшем (HIT ratio), TTFB, 3rd-party.

Быстрый план на 60–90 минут (даёт +20–40 баллов на Mobile)

1. Включить/настроить страничный кэш (LiteSpeed Cache / WP Rocket).
2. Подключить Redis Object Cache.
3. Включить Brotli/Gzip и HTTP/2/3 (на уровне сервера/CDN).
4. Перевести героизображение в WebP/AVIF, добавить preload LCP.
5. Включить delay JS и defer для маркетинговых скриптов.
6. Самохост шрифтов .woff2, font-display: swap, preload основных.
7. Удалить лишние плагины/виджеты с фронта (Asset CleanUp/Perfmatters).
8. Проверить размеры медиа и задать width/height для всех ключевых IMG (CLS).

WooCommerce: что учесть отдельно

• Кэш исключения: /cart/, /checkout/, /my-account/, ?add-to-cart=.
• Фильтры/виджеты категорий — подгружать по требованию, lazy-render под фолдом.
• Минимизировать «живые» баджи, счётчики стоков и т. п. на листингах.
• Спрятать тяжелые рекомендации/виджеты под отложенную загрузку.

Полезные сниппеты

.htaccess (Brotli/Gzip + кэширование статики)

# Compression
<IfModule mod_brotli.c>
BrotliCompressionQuality 5
AddOutputFilterByType BROTLI_COMPRESS text/html text/plain text/css application/javascript application/json image/svg+xml
</IfModule>
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/plain text/css application/javascript application/json image/svg+xml
</IfModule>

# Cache-Control
<FilesMatch "\.(ico|css|js|gif|webp|avif|jpg|jpeg|png|svg|woff|woff2)$">
Header set Cache-Control "public, max-age=31536000, immutable"
</FilesMatch>

WP-CLI: быстрая гигиена медиа

# Перегенерация превью
wp media regenerate --yes
# Очистка кэша плагина (пример для WP Rocket)
wp rocket clean --confirm

Preload шрифтов и LCP-картинки в header.php (или через hook)

add_action('wp_head', function () {
echo '<link rel="preload" as="font" type="font/woff2" href="'.get_stylesheet_directory_uri().'/fonts/Inter-regular.woff2" crossorigin>';
echo '<link rel="preload" as="image" fetchpriority="high" href="'.get_stylesheet_directory_uri().'/img/hero-1280.webp">';
});

Типичные ошибки, из-за которых 90+ не даётся

• Визуальный билдэр + десяток аддонов → десятки ненужных скриптов на всех страницах.
• Google Fonts с внешнего CDN без display=swap и без самохоста.
• Hero-картинка без preload, да ещё 300–600 КБ.
• Несколько аналитик/чатов/пикселей, загружающихся в «голове».
• Ленивая загрузка LCP-картинки (нельзя).
• Отсутствие размеров у IMG/iframes → CLS скачет.
• «Универсальная минификация/склейка всего» → ломается функционал, не растут баллы.

Минимальная «золотая» конфигурация (для 90+ Mobile чаще всего достаточно)

• Лёгкая тема + 10–20 аккуратно выбранных плагинов.
• LiteSpeed Cache (или WP Rocket) + Redis Object Cache.
• Самохост woff2-шрифтов с preload, WebP/AVIF для картинок.
• Delay JS/Defer, critical CSS, preload LCP-изображения.
• CDN + HTTP/3 + Brotli.
• Исключения для кэша на динамических страницах.
• Мониторинг PSI/WebPageTest и фиксация регрессий в CI.