Самая быстрая работа — та, которую не нужно делать

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

Кэширование — это способ «запомнить» результат и отдавать его мгновенно, не повторяя всю работу. В сочетании с CDN (Content Delivery Network) — сетью серверов по всему миру — это делает ваш сайт сверхзвуковым.

Три уровня кэширования

  1. Браузерный кэш (Browser Cache).
    Самый близкий к пользователю. Браузер сохраняет статические файлы (CSS, JS, картинки) на устройстве пользователя. При повторном визите они загружаются мгновенно с диска. Управляется HTTP-заголовками Cache-Control.
  2. Серверный кэш (Server Cache).
    Готовая HTML-страница сохраняется на сервере (в памяти или на диске). При запросе она отдаётся мгновенно, без выполнения PHP и запросов к базе данных. Реализуется плагинами (WP Rocket, W3 Total Cache) или на уровне сервера (Nginx FastCGI Cache, Redis).
  3. CDN-кэш.
    Сеть серверов по всему миру хранит копии ваших статических файлов (а иногда и целых страниц). Пользователь из Владивостока получает контент с сервера в Хабаровске, а не из Москвы.

Как управлять браузерным кэшем (заголовки)

Cache-Control: max-age=31536000, immutable. Скажи браузеру: «Этот файл не изменится год, не проверяй его».

Пример для .htaccess:

apache

<IfModule mod_expires.c>  ExpiresActive On  ExpiresByType image/webp «access plus 1 year»  ExpiresByType text/css «access plus 1 month»  ExpiresByType application/javascript «access plus 1 month»  ExpiresByType text/html «access plus 0 seconds»</IfModule>

Для Nginx:

nginx

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

CDN: ваш сайт без границ

Как работает CDN:

  1. Вы подключаете сайт к CDN (Cloudflare, BunnyCDN).
  2. DNS-записи меняются, и трафик идёт через CDN.
  3. CDN кэширует статику на своих серверах.
  4. Пользователь получает данные с ближайшего к нему сервера.

Популярные CDN:

  • Cloudflare. Бесплатный тариф, огромная сеть, защита от DDoS.
  • BunnyCDN. Дешёвый, быстрый, pay-as-you-go.

Инвалидация кэша: как обновить кэшированный контент

Проблема кэширования: как сказать браузеру или CDN, что файл изменился? Методы:

  • Версионирование URL: style.css?v=1.2.3. Меняете версию — браузер загружает новый файл.
  • Имя файла с хэшем: style.a7f8e9.css. При изменении содержимого меняется хэш.
  • Purge API: Ручной или автоматический сброс кэша на CDN.

Типичные ошибки кэширования

  • Слишком агрессивное кэширование HTML. Пользователи видят старую версию страницы. Решение: Cache-Control: no-cache для HTML.
  • Не настроен сброс кэша при обновлении. После изменения CSS/JS пользователи видят старый дизайн. Решение: версионирование.
  • Кэширование страниц корзины. Пользователь видит чужую корзину. Решение: исключить /cart/ из кэша.

Заключение

Кэширование — это «бесплатное ускорение» вашего сайта. Настройте все три уровня, и страницы будут загружаться за доли секунды для пользователей по всему миру.