Вы настроили кэшбраустинг: добавили версии к CSS и JavaScript, выставили длинные заголовки кэширования. Но браузер снова и снова скачивает те же файлы. Или пользователи видят старую версию после обновления. Причина может быть в заголовках, версионировании, CDN или HTML. Разберём, почему кэшбраустинг не работает и как это исправить.
Что такое кэшбраустинг и зачем он нужен
Кэшбраустинг — это приём, при котором к URL статических файлов добавляется версия или хеш. Например, style.css?v=2 или style.a1b2c3.css. Это позволяет браузеру кэшировать файлы надолго, а при обновлении — скачивать новую версию.
Правильный кэшбраустинг:
— длинный max-age для статических файлов;
— версия или хеш в URL;
— обновление версии при изменении файла;
— короткий max-age для HTML;
— корректные заголовки Cache-Control и Expires.
Если хотя бы одно условие нарушено, кэшбраустинг может не работать.
Причина 1: неправильные заголовки кэширования
Самая частая причина. Если заголовки Cache-Control или Expires не заданы или заданы неправильно, браузер может не кэшировать файлы или кэшировать их слишком коротко.
Что проверить:
— заголовок Cache-Control;
— заголовок Expires;
— заголовок ETag;
— заголовок Last-Modified;
— нет ли заголовка no-cache или no-store.
Для проверки используйте проверка HTTP-заголовков — инструмент покажет, какие заголовки отдаёт сервер для статических файлов.
Причина 2: версия не обновляется
Если версия в URL не обновляется при изменении файла, браузер продолжает использовать старую версию из кэша. Пользователи видят старый дизайн или старый скрипт.
Что проверить:
— обновляется ли версия при сборке;
— используется ли хеш содержимого;
— не захардкожена ли версия;
— обновляется ли версия в HTML.
Лучший вариант — использовать хеш содержимого (например, style.a1b2c3.css). Он меняется автоматически при изменении файла.
Причина 3: HTML кэшируется слишком долго
Если HTML кэшируется с длинным max-age, пользователи могут видеть старую версию страницы, даже если CSS и JavaScript обновлены.
Что проверить:
— max-age для HTML;
— нет ли кэширования HTML на CDN;
— нет ли кэширования HTML в браузере.
HTML лучше кэшировать с коротким max-age или не кэшировать вовсе. Это позволяет быстро обновлять страницы.
Причина 4: CDN кэширует старую версию
Если сайт работает через CDN, CDN может кэшировать статические файлы отдельно от origin-сервера. Замена файла на origin не приводит к обновлению на CDN, пока кэш не будет очищен.
Что проверить:
— настройки кэширования в CDN;
— очищается ли кэш при обновлении;
— используется ли версионирование для CDN;
— нет ли кэширования HTML на CDN.
Причина 5: браузер игнорирует заголовки
Иногда браузер игнорирует заголовки кэширования. Это может происходить, если:
— пользователь отключил кэширование;
— используется режим инкогнито;
— браузер кэширует файлы по-своему;
— есть расширения, которые мешают кэшированию.
Что делать:
— проверить в разных браузерах;
— проверить в обычном режиме, не в инкогнито;
— проверить без расширений;
— проверить с другого устройства.
Как найти причину
Пошаговая диагностика:
— проверьте заголовки для статических файлов;
— проверьте, обновляется ли версия;
— проверьте заголовки для HTML;
— проверьте настройки CDN;
— проверьте в разных браузерах;
— проверьте, не мешают ли расширения.
Как исправить
План действий:
— выставить длинный max-age для статических файлов;
— использовать версионирование или хеш;
— выставить короткий max-age для HTML;
— очистить кэш CDN;
— проверить результат в разных браузерах.
Как проверить результат
Чек-лист:
— статические файлы кэшируются;
— версия обновляется при изменении;
— HTML не кэшируется слишком долго;
— CDN отдаёт актуальную версию;
— пользователи видят новую версию после обновления.
Если нужно проверить сразу несколько параметров — заголовки, кэширование, CDN — логично перейти к SEO-аудиту.
Частые ошибки
— отсутствие заголовков кэширования;
— версия не обновляется;
— HTML кэшируется слишком долго;
— CDN кэширует старую версию;
— no-cache на статических файлах;
— отсутствие проверки в разных браузерах.
FAQ
Почему кэшбраустинг не работает?
Причин несколько: неправильные заголовки, версия не обновляется, HTML кэшируется слишком долго, CDN кэширует старую версию или браузер игнорирует заголовки.
Какой max-age использовать для статических файлов?
Длинный — например, 31536000 секунд (1 год). Это позволяет браузеру кэшировать файлы надолго.
Какой max-age использовать для HTML?
Короткий — например, 0 или 300 секунд. Это позволяет быстро обновлять страницы.
Что лучше: версия или хеш?
Хеш содержимого. Он меняется автоматически при изменении файла и не требует ручного обновления версии.
Может ли CDN мешать кэшбраустингу?
Да. CDN может кэшировать старую версию. Проверьте настройки кэширования и очистите кэш.
Почему пользователи видят старую версию?
Возможно, версия не обновляется, HTML кэшируется слишком долго или CDN отдаёт старую версию.
Влияет ли кэшбраустинг на SEO?
Косвенно. Он ускоряет загрузку страниц, что улучшает Core Web Vitals и пользовательский опыт.
Нужно ли кэшировать HTML?
Лучше не кэшировать или кэшировать с коротким max-age. Это позволяет быстро обновлять страницы.
Как проверить, что кэшбраустинг работает?
Проверьте заголовки для статических файлов, обновите файл и проверьте, изменился ли URL. Если URL изменился, кэшбраустинг работает.
Что делать, если кэшбраустинг не работает после обновления CMS?
Проверьте настройки CMS и плагинов. Возможно, они перезаписывают заголовки или версионирование.
