Арсенал интернет решений

Как настроить кеширование на сайте и ускорить его в 5 раз

Как настроить кеширование на сайте и ускорить его в 5 раз
Picture of Арсенал Решений
Арсенал Решений
VK
Telegram
WhatsApp
Оглавление

Кеширование сайта — это технология сохранения копий страниц, файлов и данных в промежуточном хранилище, чтобы при повторном запросе отдавать их мгновенно, не загружая сервер заново. Правильная настройка кеша сокращает время загрузки с 3-4 секунд до 0,5-0,8 секунды и снижает нагрузку на хостинг в разы.

Типы кеширования и их задачи

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

Браузерное кеширование сохраняет статические файлы (CSS, JS, картинки, шрифты) на компьютере пользователя. Когда человек возвращается на сайт, браузер берёт эти файлы с диска, а не запрашивает их заново с сервера. Настраивается через HTTP-заголовки Cache-Control и Expires, которые указывают браузеру, как долго хранить файл — обычно 7-30 дней для изображений и скриптов, до года для шрифтов.

Серверное кеширование создаёт готовые HTML-копии страниц на сервере и отдаёт их без обращения к базе данных и PHP. Вместо того чтобы при каждом запросе выполнять десятки SQL-запросов и генерировать страницу заново, сервер отдаёт сохранённую версию за миллисекунды. Это особенно критично для WordPress, где одна страница может вызывать 50-100 запросов к базе.

CDN-кеширование (Content Delivery Network) копирует статические файлы и даже целые страницы на серверы в разных точках мира. Посетитель из Владивостока получает данные с сервера в Токио, а не из датацентра в Москве — задержка падает с 200 мс до 20-30 мс. CDN также защищает от DDoS-атак и снижает нагрузку на основной хостинг до 70%.

Настройка браузерного кеша через .htaccess

Самый быстрый способ — добавить правила в файл .htaccess в корне сайта. Этот файл управляет настройками Apache и работает сразу после сохранения, без перезапуска сервера.

Открой .htaccess через FTP или файловый менеджер хостинга и добавь в конец файла:

<IfModule mod_expires.c>
  ExpiresActive On
  ExpiresByType image/jpg "access plus 1 year"
  ExpiresByType image/jpeg "access plus 1 year"
  ExpiresByType image/png "access plus 1 year"
  ExpiresByType image/webp "access plus 1 year"
  ExpiresByType text/css "access plus 1 month"
  ExpiresByType application/javascript "access plus 1 month"
  ExpiresByType font/woff2 "access plus 1 year"
</IfModule>

<IfModule mod_headers.c>
  <FilesMatch "\.(jpg|jpeg|png|webp|css|js|woff2)$">
    Header set Cache-Control "max-age=31536000, public"
  </FilesMatch>
</IfModule>

Здесь ExpiresActive On включает механизм, а директивы ExpiresByType задают срок хранения для каждого типа файлов. Параметр max-age=31536000 — это один год в секундах. После сохранения проверь через DevTools браузера (F12 → вкладка Network): в заголовках ответа должна появиться строка Cache-Control: max-age=31536000.

Если используешь Nginx, добавь аналогичные правила в конфигурационный файл сайта:

location ~* \.(jpg|jpeg|png|webp|css|js|woff2)$ {
  expires 1y;
  add_header Cache-Control "public, immutable";
}

Серверное кеширование через плагины WordPress

Для динамических сайтов на WordPress плагины кеширования автоматизируют создание статических копий страниц и управляют их обновлением.

WP Rocket (платный, от $59/год) — самый простой в настройке. После установки включи в настройках: Page Caching (кеширование страниц), Cache Preloading (предзагрузка — плагин сам обходит все страницы и создаёт копии), Browser Caching (автоматически прописывает правила в .htaccess). Дополнительно активируй Minification для сжатия CSS и JS, Lazy Loading для отложенной загрузки изображений.

W3 Total Cache (бесплатный) — более гибкий, но сложнее в настройке. После установки:

  • Включи Page Cache → Disk: Enhanced (сохраняет страницы на диск сервера)
  • Активируй Browser Cache → установи галочки напротив всех типов файлов
  • Включи Object Cache → Disk (кеширует результаты SQL-запросов)
  • В Database Cache выбери Disk — это ускоряет повторяющиеся запросы к базе

LiteSpeed Cache (бесплатный, только для серверов LiteSpeed) — работает на уровне веб-сервера, показывает лучшие результаты. Включи в настройках: Cache → Enable, CSS/JS Minify, Image Optimization (встроенное сжатие через API). Плагин автоматически интегрируется с сервером и не требует .htaccess.

После активации любого плагина зайди на главную страницу в режиме инкогнито, обнови её несколько раз и проверь через DevTools: в заголовках должна появиться строка X-Cache: HIT или X-LiteSpeed-Cache: hit — это значит, что сервер отдал кешированную версию.

Подключение CDN для ускорения глобальной загрузки

CDN — это сеть из десятков серверов по всему миру, которые копируют статику твоего сайта и отдают её посетителям с ближайшей точки. Подключение занимает 10-15 минут.

Cloudflare (бесплатный тариф) — самый популярный вариант:

  1. Зарегистрируйся на cloudflare.com, добавь свой домен
  2. Cloudflare покажет два DNS-сервера — скопируй их
  3. Зайди в панель управления доменом у регистратора, замени текущие DNS на серверы Cloudflare
  4. Дождись обновления (15 минут — 48 часов, обычно 1-2 часа)
  5. В панели Cloudflare включи Auto Minify (сжатие CSS/JS/HTML), Brotli (дополнительное сжатие), Polish для автоматической оптимизации картинок

После подключения статические файлы начнут отдаваться с серверов Cloudflare, а не с твоего хостинга. Проверь в DevTools: в заголовке ответа появится cf-cache-status: HIT и Server: cloudflare.

KeyCDN или BunnyCDN (от $1/месяц) — альтернативы с более гибкой настройкой. Создай Pull Zone (зону, которая копирует файлы с твоего сайта), укажи домен сайта как источник, получи CDN-ссылку. В настройках плагина кеширования (WP Rocket, W3 Total Cache) включи раздел CDN и вставь полученную ссылку — плагин автоматически заменит пути к файлам на CDN-версии.

Кеширование динамического контента: как не сломать функциональность

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

Исключение страниц из кеша: В WP Rocket или W3 Total Cache есть раздел «Never Cache» — добавь туда URL страниц корзины, оформления заказа, личного кабинета (обычно /cart/, /checkout/, /my-account/). Эти страницы будут генерироваться динамически при каждом запросе.

Кеширование с динамическими блоками: Для страниц каталога или блога, где большая часть контента статична, но есть счётчики товаров в корзине или имя пользователя, используй технологию Edge Side Includes (ESI) в Cloudflare Enterprise или настрой AJAX-подгрузку динамических частей. Например, WooCommerce-плагин WP Rocket умеет автоматически обновлять корзину через AJAX, не ломая кеш основной страницы.

Кеширование для авторизованных пользователей: В W3 Total Cache включи опцию «Don’t cache pages for logged in users» — это предотвратит показ чужих данных. Альтернативно, настрой раздельный кеш: отдельные копии для гостей и для каждой роли пользователей (подписчик, автор, админ).

Когда нужно очищать кеш и как это делать правильно

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

Автоматическая очистка: Плагины WP Rocket, W3 Total Cache и LiteSpeed Cache автоматически чистят кеш конкретной страницы, когда ты сохраняешь запись или страницу. Также они обновляют главную страницу, архив категории и другие связанные страницы. Проверь в настройках плагина раздел «Cache Purge» — там должны быть активированы опции «Clear cache on post update» и «Clear related pages».

Ручная очистка: После обновления темы, установки плагинов или изменений в CSS/JS зайди в админку WordPress — в верхней панели появится кнопка плагина кеша (например, «Clear Cache» в WP Rocket). Нажми её, чтобы удалить все сохранённые копии — сайт заново сгенерирует страницы при следующих посещениях.

Выборочная очистка для CDN: В панели Cloudflare перейди в раздел Caching → Configuration → Purge Cache. Есть три варианта: Purge Everything (полная очистка, используй осторожно — на несколько минут возрастёт нагрузка на сервер), Purge by URL (удали кеш конкретных страниц, вставь их адреса), Purge by Tag (для продвинутых сценариев с тегами в коде).

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

Измерение результатов: инструменты и метрики

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

PageSpeed Insights (pagespeed.web.dev) — официальный сервис Google. Введи URL главной страницы, дождись анализа. Смотри на метрики: FCP (First Contentful Paint, первая отрисовка — должна быть до 1,8 с), LCP (Largest Contentful Paint, загрузка основного контента — до 2,5 с), TTI (Time to Interactive, готовность к взаимодействию — до 3,8 с). После включения кеша эти цифры должны упасть на 40-60%.

GTmetrix (gtmetrix.com) — показывает детальный водопад загрузки. Зарегистрируйся, выбери сервер для теста (например, Лондон или Токио, чтобы проверить работу CDN). Смотри на Fully Loaded Time — общее время загрузки. У оптимизированного сайта с кешем — 1-2 секунды, без кеша — 4-7 секунд. Также проверь размер страницы: после включения минификации и сжатия он должен уменьшиться на 30-50%.

WebPageTest (webpagetest.org) — для глубокого анализа. Запусти тест с опцией «First View and Repeat View» — первый визит покажет загрузку без кеша, повторный — с кешем браузера. Разница должна быть в 3-5 раз: например, 3,2 с при первом визите и 0,6 с при повторном.

Встроенные метрики плагинов: WP Rocket показывает статистику экономии трафика и количество кешированных страниц в разделе Dashboard. LiteSpeed Cache отображает процент попаданий в кеш (hit rate) — нормальное значение 85-95%, если ниже — проверь настройки исключений.

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

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

Для среднего сайта на WordPress — 500 МБ – 2 ГБ. Это зависит от количества страниц, вариаций мобильной и десктопной версий. Плагины автоматически очищают старые файлы, но можно установить лимит в настройках, например, в W3 Total Cache есть опция ограничения размера кеша до 1 ГБ.

Положительно влияет: быстрая загрузка — прямой фактор ранжирования. Google использует реальные метрики Core Web Vitals, которые улучшаются с кешем. Единственный момент — убедись, что кеш не блокирует сканирование роботов: в настройках плагина должна быть опция отключения кеша для ботов поисковиков.

Нет, это приведёт к конфликтам и ошибкам 500. Активируй только один плагин серверного кеша: WP Rocket, W3 Total Cache или LiteSpeed Cache. Браузерное кеширование через .htaccess и CDN можно комбинировать с любым плагином.

Очисти кеш плагина через админку WordPress и кеш браузера (Ctrl+Shift+R или Cmd+Shift+R). Если используешь CDN — очисти кеш в панели Cloudflare или другого сервиса. Проверь в режиме инкогнито: если там версия новая, значит проблема в локальном кеше браузера.

Срок устанавливается один раз в .htaccess и действует постоянно. Файлы с одинаковым именем браузер будет хранить указанное время. Чтобы заставить браузеры загрузить обновлённый файл, плагины добавляют версии к именам файлов, например style.css?ver=1.2.3 — при изменении версии браузер скачает новый файл.


Похожие материалы