Кэширование сайта — Apache vs Nginx

Введение

Без настроенного кеширования браузер пользователя вынужден при каждом переходе повторно скачивать тяжелые статические файлы (изображения, стили, скрипты, шрифты). Это увеличивает время ответа сервера, расходует трафик и ухудшает метрики Core Web Vitals (LCP, Speed Index).

Что будет сделано:

Разобраны типы кешируемой статики и принципы работы Browser Cache;
Настроены правила кеширования и заголовки Cache-Control для веб-сервера Apache через .htaccess;
Сконфигурированы блоки location и директива expires для Nginx;
Разобрана альтернативная настройка через прокси Cloudflare для shared-хостингов.

Результат: ускорение повторной загрузки страниц до 2–5 раз за счет локального сохранения ресурсов в браузере и снижение нагрузки на сервер.

1. Объекты браузерного кеширования

Браузерный кеш (browser cache) сохраняет файлы на устройстве пользователя. В отличие от page cache (кеширования готового HTML), browser cache отвечает только за статические ресурсы.

Кешированию подлежат:

Изображения: JPG, PNG, GIF, WebP, SVG, ICO;
Стили и скрипты: CSS, JS;
Шрифты: WOFF2, WOFF, TTF, EOT.

При повторном визите браузер проверяет локальный диск или память и загружает файл без сетевого запроса к серверу со статусом 200 (from memory cache) или 304 Not Modified.

2. Настройка кеширования в Apache

На серверах под управлением Apache или классических shared-хостингах кеширование настраивается через файл .htaccess в корневой директории сайта.

2.1. Модуль mod_expires

Модуль mod_expires выставляет дату истечения срока действия ресурса:

<IfModule mod_expires.c>
  ExpiresActive On

  ExpiresByType image/jpeg "access plus 1 year"
  ExpiresByType image/png  "access plus 1 year"
  ExpiresByType image/gif  "access plus 1 year"
  ExpiresByType image/webp "access plus 1 year"
  ExpiresByType image/svg+xml "access plus 1 year"
  ExpiresByType image/x-icon "access plus 1 year"

  ExpiresByType font/woff2 "access plus 1 year"
  ExpiresByType font/woff  "access plus 1 year"

  ExpiresByType text/css "access plus 1 month"
  ExpiresByType application/javascript "access plus 1 month"

  ExpiresDefault "access plus 7 days"
</IfModule>

2.2. Заголовки Cache-Control

Для современных браузеров и прокси-серверов рекомендуется явно передавать заголовок Cache-Control:

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

3. Настройка кеширования в Nginx

В Nginx отсутствуют файлы локальных переопределений типа .htaccess. Конфигурация вносится непосредственно в файл виртуального хоста в блоке server { ... } (например, /etc/nginx/sites-available/example.com).

Добавьте правила после директив root и index:

server {
    listen 80;
    server_name example.com;

    root /var/www/example.com/public;
    index index.php index.html;

    # Кеширование изображений и шрифтов (1 год)
    location ~* \.(jpg|jpeg|png|gif|webp|svg|ico|woff2|woff)$ {
        expires 1y;
        add_header Cache-Control "public, immutable";
        access_log off;
    }

    # Кеширование CSS и JS (30 дней)
    location ~* \.(css|js)$ {
        expires 30d;
        add_header Cache-Control "public";
        access_log off;
    }

    location / {
        try_files $uri $uri/ /index.php?$args;
    }

    location ~ \.php$ {
        fastcgi_pass unix:/run/php/php8.4-fpm.sock;
        include fastcgi_params;
    }
}

Директива access_log off; отключает запись запросов статики в журнал, экономя дисковые операции сервера.

4. Настройка кеширования в Cloudflare

Если проект размещен на shared-хостинге без доступа к конфигурационным файлам сервера, оптимальный путь — подключение сайта через прокси Cloudflare.

4.1. Параметр Browser Cache TTL

В панели управления Cloudflare перейдите в раздел:

Caching → Configuration → Browser Cache TTL

Рекомендуемое значение для стабильных проектов — 1 month.

4.2. Очистка кеша

После внесения изменений в стили или скрипты сбросьте кеш прокси:

Caching → Configuration → Purge Cache → Purge Everything

Вывод

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

1. Чек-лист версионирования ассетов

При долгом сроке жизни кеша (1y или 30d) браузер не запрашивает файл повторно до истечения срока. Чтобы изменения вступили в силу мгновенно:

Используйте query-параметры версий: /assets/css/app.css?v=1.0.4
Используйте хеши в именах файлов (рекомендуется): /assets/css/app.9b2c1f.css
Не кешируйте HTML: кеширование главного документа запрещено, иначе клиент никогда не получит ссылки на обновленные ассеты.

2. Проверка заголовков ответа

Проверьте корректность отдачи заголовков с помощью curl:

curl -I https://example.com/assets/css/app.css

Ищите в ответе строки:

Cache-Control: public, max-age=2592000
Expires: ...

3. Шпаргалка команд

Проверка конфигурации Nginx: sudo nginx -t
Перезагрузка Nginx: sudo systemctl reload nginx
Проверка Apache: sudo apachectl configtest
Перезагрузка Apache: sudo systemctl reload apache2