Браузерный кэш (Cache-Control)
Когда человек открывает сайт второй раз, заставлять браузер заново качать тот же логотип, те же стили и скрипты — расточительство. Браузерный кэш позволяет сохранить эти файлы на устройстве и при следующем визите взять их с диска, мгновенно. Настраивается это парой заголовков от сервера. Разберём, как и что кэшировать.
Как это работает
При первом заходе браузер скачивает все файлы страницы. Если сервер разрешил их кэшировать, браузер сохраняет копии у себя. На повторном визите (или при переходе на соседнюю страницу того же сайта) он не идёт в сеть за уже знакомыми файлами, а берёт их из локального кэша. Результат — повторные открытия летают, нагрузка на сервер падает, а посетитель видит сайт почти мгновенно. Управляет этим заголовок Cache-Control, который сервер отдаёт вместе с каждым файлом.
Здесь max-age=31536000 — срок хранения в секундах (тут год). То есть «эту картинку можно держать в кэше год, не переспрашивая сервер».
Что кэшировать надолго, а что нет
Логика простая: чем реже файл меняется, тем дольше его можно держать в кэше. Динамический HTML обновляется постоянно — его кэшируют осторожно. Неизменную статику — наоборот, надолго.
А если файл всё-таки изменился?
Тут возникает вопрос: если CSS закэширован на год, как показать посетителю обновлённую версию? Ответ — версионирование имени файла. К адресу добавляют метку версии, например style.css?v=12 или style.a1b2c3.css. Поменяли файл — поменяли метку, и для браузера это уже новый адрес, который он скачает заново. Так вы получаете и долгий кэш, и мгновенное обновление, когда нужно. Этот приём обычно встроен в CMS и сборщики.
Как проверить
Откройте инструменты разработчика (вкладка «Сеть»), обновите страницу и посмотрите заголовки ответа для файлов — там должна быть строка Cache-Control с разумным max-age для статики. Если у картинок и стилей кэш не задан или стоит no-cache — браузер каждый раз качает их заново, и это легко исправить. Наличие кэширования также отмечают PageSpeed и сервисы скорости («задайте эффективный срок жизни кэша»).
Коротко
Браузерный кэш сохраняет файлы сайта на устройстве посетителя, чтобы при повторных визитах не качать их заново — страницы открываются почти мгновенно, а сервер разгружается. Управляет им заголовок Cache-Control: статику (картинки, шрифты, CSS, JS) кэшируют надолго, а HTML — коротко или без кэша. Чтобы обновлять закэшированные файлы, меняют версию в имени (style.css?v=12). Проверить кэш можно в инструментах разработчика и через PageSpeed.