← Назад к вопросам

Кэширует ли браузер все подряд

1.3 Junior🔥 123 комментариев
#Браузер и сетевые технологии#Оптимизация и производительность

Комментарии (3)

🐱
deepseek-v3.2PrepBro AI4 апр. 2026 г.(ред.)

Ответ сгенерирован нейросетью и может содержать ошибки

Кэширование в браузере: не всё подряд, а по правилам

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

Ключевые факторы, влияющие на кэширование

Решение о кэшировании принимается на основе HTTP-заголовков ответа сервера и настроек самого браузера. Вот основные механизмы:

  1. Заголовки Cache-Control — главный инструмент управления кэшем.
    *   `Cache-Control: no-store` — **запрещает** кэширование полностью. Используется для строго конфиденциальных данных.
    *   `Cache-Control: no-cache` — не запрещает кэширование, но **требует проверки** актуальности (revalidation) с сервером перед каждым использованием.
    *   `Cache-Control: max-age=3600` — разрешает кэшировать и указывает **время в секундах**, в течение которого ресурс считается свежим (например, 1 час).
    *   `Cache-Control: public / private` — `public` позволяет кэшировать прокси-серверам (CDN), `private` — только браузеру пользователя.

  1. Заголовки Expires и ETag / Last-Modified — устаревшие и валидационные механизмы.
    *   `Expires: <дата>` — устаревший аналог `max-age`, указывает абсолютную дату истечения срока действия.
    *   `ETag` и `Last-Modified` — используются для **проверки актуальности** (conditional requests). Если кэш устарел, браузер отправляет запрос с заголовками `If-None-Match` (для ETag) или `If-Modified-Since` (для Last-Modified). Сервер может ответить `304 Not Modified`, что означает "используй свою кэшированную версию".

  1. Эвристическое кэширование — если сервер не указал явных директив, браузер может самостоятельно принять решение на основе эвристик (например, кэшировать ресурс на 10% от разницы между Date и Last-Modified).

Что браузер обычно НЕ кэширует (или кэширует с особыми условиями)

  • Ответы на POST, PUT, DELETE запросы (кроме явных указаний в спецификациях, например, для POST с Cache-Control: max-age).
  • Ответы с аутентификацией (заголовок Authorization) обычно помечаются как private или no-cache.
  • Динамический контент (HTML-страницы, генерируемые на лету) часто отправляются с Cache-Control: no-cache, чтобы всегда запрашивать актуальную версию.
  • Ресурсы с уникальным URL — если URL содержит случайный параметр (например, script.js?v=12345 или image.png?timestamp=16788804), браузер воспринимает каждый такой URL как уникальный ресурс и кэширует его отдельно.

Пример на практике

Рассмотрим типичный сценарий для статических ресурсов (CSS, JS, изображения), которые имеют смысл кэшировать надолго:

# Конфигурация Nginx для статических ресурсов
location ~* \.(css|js|png|jpg|jpeg|gif|ico|svg|woff2)$ {
    expires 1y; # Устанавливает заголовок Expires на год вперёд
    add_header Cache-Control "public, immutable, max-age=31536000";
    # "immutable" подсказывает браузеру, что файл не изменится, и не нужно проверять актуальность
}

А вот для HTML-документа (который может обновляться) стратегия иная:

location / {
    # HTML кэшируется ненадолго или требует валидации
    add_header Cache-Control "public, no-cache";
    # или более современный аналог
    # add_header Cache-Control "public, max-age=0, must-revalidate";
}

Стратегии инвалидации кэша

Чтобы обновлять закэшированные ресурсы, используют следующие приёмы:

  • Изменение имени файла (fingerprinting)app.a1b2c3d4.js. При сборке проекта хэш содержимого встраивается в имя. Новое содержимое = новое имя файла = новый запрос.
  • Версионирование через query-параметрapp.js?v=2. Менее надёжно, так как некоторые прокси-серверы могут не кэшировать URL с параметрами.
  • Использование ETag — сервер сообщает, изменился ли контент.

Вывод

Браузер — это не бездумный накопитель, а интеллектуальный кэш-менеджер. Он кэширует ресурсы строго в соответствии с:

  1. Директивами сервера (HTTP-заголовками).
  2. Типом запроса и содержимого.
  3. Собственными эвристиками, если директив нет.
  4. Лимитами размера кэша, удаляя наименее используемые ресурсы.

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

Кэширует ли браузер все подряд | PrepBro