Быстрые ссылки

Почему сайт медленно грузится и как его ускорить

Поделиться

Когда клиент пишет «сайт тормозит», первое, что я делаю, — не ставлю плагин кэширования, а выясняю, где именно тормозит. Сайт может долго думать на сервере, долго качать картинки или долго выполнять JavaScript в браузере. У каждой причины своё лечение, и универсальная «таблетка» обычно лечит не то.

Как измерить

PageSpeed Insights (pagespeed.web.dev) — показывает оценку и, главное, реальные данные пользователей Chrome (Core Web Vitals), если сайт достаточно посещаемый. Смотрите мобильную версию — она важнее.

Вкладка Network в браузере (F12) — видно, сколько весит страница, сколько запросов, какой файл грузится дольше всего. Поставьте галочку Disable cache и ограничение скорости Fast 4G.

Время ответа сервера (TTFB) — в Network у первого запроса (сам HTML), колонка Waiting for server response. Или в терминале:

curl -o /dev/null -s -w "TTFB: %{time_starttransfer}s\n" https://example.by/

Проверьте несколько раз и несколько страниц: главную, категорию, карточку товара.

Три главные метрики

  • LCP (Largest Contentful Paint) — когда показался самый большой элемент первого экрана, обычно баннер или заголовок. Хорошо — до 2,5 секунды.
  • CLS (Cumulative Layout Shift) — насколько прыгает вёрстка при загрузке. Хорошо — до 0,1.
  • INP (Interaction to Next Paint) — как быстро страница реагирует на клик. Хорошо — до 200 мс.

Причина 1. Медленный сервер

Если TTFB больше 600–800 мс, проблема на стороне сервера, и оптимизация картинок её не решит.

Что проверять:

  • версию PHP. PHP 8.x заметно быстрее 7.x. Переключить можно в панели хостинга, но сначала проверьте совместимость на копии;
  • OPcache. Должен быть включён — без него PHP каждый раз заново компилирует файлы;
  • кэширование страниц. Готовые страницы отдаются из кэша, не запуская PHP и базу;
  • медленные запросы к базе. Тяжёлые плагины, фильтры, подсчёт товаров в категориях;
  • хостинг. Дешёвый виртуальный хостинг с сотнями сайтов на одном сервере физически не может быстро отвечать.

WordPress

Таблица wp_options с огромной автозагрузкой — частая причина медленного ответа. Проверить:

SELECT SUM(LENGTH(option_value)) / 1024 / 1024 AS mb FROM wp_options WHERE autoload = 'yes';

Если больше 1–2 МБ — ищите, какие опции раздуты (часто остатки удалённых плагинов):

SELECT option_name, LENGTH(option_value) AS len FROM wp_options WHERE autoload = 'yes' ORDER BY len DESC LIMIT 20;

Плагин Query Monitor показывает, какие плагины делают больше всего запросов на странице.

OpenCart

В Система — Настройки — вкладка «Опции» отключите «Подсчёт количества товаров» в категориях — на больших каталогах это десятки тяжёлых запросов на каждой странице. Проверьте индексы в таблицах товаров и SEO-адресов.

1С-Битрикс

Включите композитный сайт и кэш компонентов, переведите агенты на cron, проверьте монитор производительности — он прямо показывает узкие места.

Причина 2. Тяжёлые изображения

Если страница весит 5–10 МБ, почти всегда виноваты картинки.

  • Формат WebP вместо JPG и PNG — тот же вид при меньшем весе в 1,5–3 раза.
  • Правильный размер. Картинка для блока шириной 400 пикселей не должна быть 4000 пикселей.
  • Отложенная загрузка для всего ниже первого экрана — атрибут loading=»lazy».
  • Не откладывайте главную картинку первого экрана — наоборот, ей можно дать приоритет:
<img src="/img/hero.webp" width="1200" height="600" fetchpriority="high" alt="...">
  • Указывайте width и height у всех изображений — браузер заранее резервирует место, и вёрстка не прыгает (CLS).

Слайдер на первом экране с 5–10 большими картинками — один из худших вариантов для скорости. Если без слайдера никак, хотя бы грузите следующие слайды лениво.

Причина 3. Лишний JavaScript и CSS

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

Что делать:

  • убрать то, что не используется;
  • отложить загрузку некритичных скриптов (атрибут defer или загрузка после первого взаимодействия);
  • карты Яндекса или Google на странице контактов показывать по клику или статичной картинкой со ссылкой;
  • объединять и минифицировать CSS и JS — осторожно, с проверкой, это частая причина поломок.

Причина 4. Шрифты

Внешние шрифты с Google Fonts — лишнее соединение с чужим сервером. Лучше загрузить шрифты на свой сайт в формате WOFF2, только нужные начертания и наборы символов (кириллица и латиница), и указать font-display: swap, чтобы текст показывался сразу:

@font-face {
  font-family: 'Montserrat';
  src: url('/fonts/montserrat-cyrillic.woff2') format('woff2');
  font-weight: 300 800;
  font-display: swap;
}

Причина 5. Конструкторы страниц

Elementor, WPBakery, Divi генерируют много лишней разметки и подключают свои библиотеки. Сайт на конструкторе можно ускорить, но обычно не до уровня сайта без него.

Что помогает в Elementor:

  • Elementor — Настройки — Особенности: включить оптимизированную загрузку ресурсов и улучшенную загрузку CSS;
  • отключить неиспользуемые виджеты и Font Awesome, если иконки не нужны;
  • убрать анимации появления на мобильных;
  • не использовать фоновое видео на первом экране.

Порядок, в котором я ускоряю сайт

  1. Замеры «до»: PageSpeed мобильный, TTFB трёх типов страниц, вес страниц.
  2. Сервер: PHP, OPcache, кэш страниц, медленные запросы.
  3. Изображения: WebP, размеры, ленивая загрузка.
  4. Скрипты: удаление лишнего, отложенная загрузка.
  5. Шрифты: локально, swap.
  6. Проверка: формы, корзина, оплата, мобильное меню.
  7. Замеры «после».

Обычно на шагах 2 и 3 получается основная часть результата.

Чего не делать

  • Не ставьте одновременно два плагина кэширования.
  • Не включайте объединение JavaScript без проверки — сломается корзина или слайдер.
  • Не гонитесь за 100 баллами: разница между 85 и 100 почти не влияет на пользователей, а стоит дорого.

Когда проблема в хостинге

Если после всех оптимизаций TTFB остаётся больше секунды на простой странице — сервер не справляется. Тогда выход один: более мощный тариф или перенос сайта на другой хостинг. Об этом — в статье «Перенос сайта на другой хостинг без потери позиций».

Если не хочется разбираться самому, ускорение — отдельная услуга: ускорение сайта с замерами до и после.

Как настроить кэширование на сервере

Если у вас свой сервер или VPS с nginx, страничный кэш можно включить на уровне веб-сервера — это быстрее любого плагина. Для сайтов на PHP-FPM используется fastcgi_cache:

fastcgi_cache_path /var/cache/nginx/site levels=1:2 keys_zone=SITE:50m inactive=60m;

location ~ \.php$ {
    set $skip 0;
    if ($request_method = POST) { set $skip 1; }
    if ($http_cookie ~* "wordpress_logged_in|woocommerce_items_in_cart|PHPSESSID") { set $skip 1; }
    fastcgi_cache SITE;
    fastcgi_cache_valid 200 30m;
    fastcgi_cache_bypass $skip;
    fastcgi_no_cache $skip;
    include fastcgi_params;
    fastcgi_pass unix:/run/php/php8.2-fpm.sock;
}

Кэш не применяется к авторизованным пользователям, корзине и POST-запросам, иначе покупатели увидят чужие корзины. На виртуальном хостинге этот вариант недоступен — там работают плагины кэширования или встроенный кэш хостинга.

Сжатие и заголовки кэширования

Две простые настройки, которые часто забывают:

  • сжатие gzip или brotli для HTML, CSS, JS и SVG — уменьшает объём передачи в несколько раз;
  • долгий срок кэширования статики в браузере — картинки, шрифты, стили и скрипты не загружаются повторно при переходе между страницами.

Для nginx:

gzip on;
gzip_types text/css application/javascript image/svg+xml application/json;
location ~* \.(css|js|webp|jpg|png|svg|woff2)$ { expires 30d; add_header Cache-Control "public"; }

Чтобы после обновления стилей посетители получили новую версию, у файлов должна меняться версия в адресе — WordPress и большинство CMS делают это параметром ver.

Пример замера до и после

Типичная картина для сайта услуг на WordPress с конструктором страниц на недорогом хостинге:

Показатель Типично до Цель после
TTFB главной 1,2–2 с до 0,3–0,6 с
Вес главной 4–8 МБ до 1,5 МБ
Запросов 100–150 до 50–60
LCP мобильный 5–8 с до 2,5 с

Это ориентиры, а не обещание: результат зависит от темы, хостинга и того, сколько виджетов вы готовы убрать.

Чек-лист ускорения

  1. Замерить TTFB, LCP, CLS и вес трёх типов страниц.
  2. Актуальный PHP и включённый OPcache.
  3. Кэш страниц — на сервере или плагином.
  4. Чистка базы и медленных запросов.
  5. Изображения в WebP с размерами и ленивой загрузкой.
  6. Удаление лишних скриптов, отложенная загрузка виджетов.
  7. Шрифты локально, font-display: swap.
  8. Сжатие и кэширование статики.
  9. Проверка форм, корзины, оплаты, мобильного меню.
  10. Повторный замер и сравнение.

Частые ошибки при ускорении

  • Несколько плагинов кэширования одновременно. Они конфликтуют, и сайт начинает показывать устаревшие страницы.
  • Агрессивное объединение скриптов. Объединение и отложенная загрузка всех JS ломают меню, слайдеры и формы. Включайте по одной опции и проверяйте.
  • Ускорение только ради оценки PageSpeed. Важнее реальные показатели посетителей из отчёта Core Web Vitals в Search Console.
  • Удаление стилей без проверки. Функции удаления неиспользуемого CSS могут убрать стили всплывающих окон и мобильного меню.
  • Кэш на страницах корзины и личного кабинета. Их обязательно исключают из кэширования.

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

Поможет ли CDN?

CDN полезен, если посетители из разных стран или много тяжёлой статики. Для сайта с аудиторией в Беларуси на хорошем местном хостинге основной эффект дают кэш, изображения и чистка скриптов.

Как часто нужно повторять ускорение?

Проверяйте скорость после крупных изменений: новой темы, плагинов, виджетов. Раз в квартал полезно смотреть отчёт Core Web Vitals.

Нужна помощь?

Если не хочется разбираться самому или не получилось — напишите мне. Посмотрю сайт и скажу, что сломалось и сколько стоит исправить.

Ускорение сайтаНаписать в TelegramНаписать в Viber

Leave a comment