Что такое браузерный кэш
11 видов кэширования для современного сайта
Автор данной статьи не встречал структурированной обзорной информации о важных этапах кэширования, поэтому ему хотелось бы поделиться наработанным опытом в этой области, соединить воедино всю основную информацию по данному вопросу, а также рассмотреть плюсы и минусы каждого вида кэширования.
В первую очередь, хотелось бы пояснить, что кэширование – это одна из наиболее важных составляющих любого проекта. В частности, это единственный способ сделать больше и быстрее при использовании ограниченных ресурсов. А, как известно, ресурсы всегда ограничены: как серверные, так и пользовательские.
Основной проблематикой кэширования является быстрота реакции на запросы к основным системам хранения и обработки входящей и исходящей структурированной информации.
Представьте, что необходимо осуществить быструю передачу информации, однако скорость доступа к данным крайне низкая. Или другая ситуация: скорость хорошая, но мало доступной памяти или ширина канала недостаточная, или процессорные и дисковые факторы мешают осуществить задачу. В этом случае кэширование – это единственный выход из ситуации.
Виды кэширования
Кэширование (или кэш) – это некий промежуточный буфер, в котором хранятся данные. Благодаря кэшированию страница сайта не воссоздается заново для каждого пользователя. Кэширование позволяет осуществлять работу с большим количеством данных в максимально сжатые сроки и при ограниченных ресурсах (серверных и пользовательских).
Необходимо понимать, что работу с данными можно производить как на стороне клиента, так и на сервере. Притом, серверная обработка данных централизована и имеет ряд несомненных преимуществ (особенно для службы поддержки).
Существует несколько видов кэширования, предлагаем рассмотреть каждый вид, его особенности и рекомендации по применению:
1. Браузерное кэширование или клиентское кэширование
Представляет собой составление для браузера команды использовать имеющуюся кэшированную копию. Работа такого кэширования основана на том, что при повторном посещении, браузеру отдаётся заголовок 304 Not Modified, а сама страница или картинка загружаются из локального пользовательского кэша. Получается, что вы экономите на трафике между браузером посетителя и хостингом сайта. Соответственно, страница вашего сайта начинает загружаться быстрее.
1.1 Кэширование файлов и картинок
Браузерное кэширование как нельзя лучше подходит для сайтов, содержащих большое количество изображений: картинка не скачивается каждый раз при открытии сайта, а просто загружается через кэш браузера.
Это первый уровень кэширования, который состоит в отдаче заголовка «expired» и заголовка «304 Not Modified». Наиболее эффективным считается кэширование на 2 недели.
Однако в данном случае есть важный нюанс: если изображение на сайте меняется, то браузер узнает об этом не сразу, а только если выждать expiry или сбросить кэш в самом браузере. Это не очень эффективно, если файл постоянно изменяется и необходимо постоянно отдавать его актуальную версию.
1.2 Кэширование https
Специальные заголовки вида strict-security. Позволяет браузеру всегда обращаться по https к выбранному домену. Сохраняет это состояние довольно жёстко и, в случае отмены этого вида кэша, браузер ещё довольно долго будет пытаться загрузить страницу по https, при этом игнорируя текущие заголовки.
1.3 Кэширование центра сертификации
Так называемый, stamp центра сертификации.
Данный вид кэширования считается обязательным для применения, если вы не хотите, чтобы пользователи вашего сайта ждали, когда центр сертификации (а это некий сервер, который отвечает за достоверность вашего сертификата) обработает запрос от браузера пользователя и подтвердит, что ваш сайт действительно подтверждён им.
1.4 Кэширование страниц
Когда страница уже сгенерирована, нужно постоянно отслеживать ее актуальность. Для этого вы должны использовать серверный кэш с отслеживанием времени изменения отдельных частей страницы (если страница строится из множества динамически генерируемых блоков). При таком подходе в каждом ответе от сервера установлены специальные заголовки, обозначающие время изменения страницы, которые затем отправляются браузером пользователя при повторном обращении к странице сайта. Сервер при получении таких заголовков можем проанализировать текущее состояние страницы (возможно, даже отрисовать её), но вместо содержимого страницы отдать заголовок «304 Not Modified», что для пользовательского браузера будет означать, что можно показать страницу из своего (браузера пользователя) кэша.
Конечно, можно отправлять соответствующие заголовки без использования серверного отслеживания кэша, но в таком случае большинство пользователей получат обновление контента страницы довольно поздно. При таком подходе браузер иногда опрашивает сервер для получения обновлений, но периодичность и правила для каждого браузера настраиваются его разработчиком, поэтому надеяться на то, что ваши пользователи получат обновления вовремя, не приходится.
Как правило, кэш подразделяется по типу пользователей:
— для авторизованных;
— для неавторизованных.
Данное разделение обусловлено уникальностью контента, для каждого авторизованного пользователя и общностью контента для гостевых пользователей. В большинстве сайтов не авторизованный пользователь не может изменять содержимое сайта, а значит и влиять на его содержимое.
Браузерный кэш позволяет экономить трафик и время, затрачиваемое на загрузку страниц. Но для достижения эффекта экономии, пользователь должен хотя бы один раз посетить нашу страницу, а это означает, что нагрузка на серверные ресурсы уменьшится, но не значительно.
2. Серверное кэширование
Под серверным кэшированием понимаются все виды кэширования, при котором данные хранятся на серверной стороне. Эти данные не доступны клиентским браузерам. Кэш создаётся и хранится по принципу «один ко многим» (многие, в данном случае, — это клиентские устройства).
2.1 Кэширование страницы целиком
Наиболее эффективный кэш. Чем он интересен? Самое большое его достоинство в том, что отдача страницы происходит практически в момент обращения, как следствие – это возможность обработки миллионов запросов даже на самом слабом сервере со скоростью работы памяти и с незначительным задействованием процессора.
Пожалуй, любой когда-либо мечтал о сайте, работающем со скоростью «ping» или быстрее.
Но и у этого типа кэша есть свои минусы: например, невозможность кэшировать страницы для авторизованного пользователя, либо пользователя, содержимое страницы которого зависит от текущих переменных пользователя.
Используйте этот кэш, если серверу известны все статичные состояния внешних данных, такие как: uri, get (без дополнительных параметров), пользователь не авторизован — то есть, фактически, это идеальное состояние страницы для гостевых пользователей. Учитывайте тот факт, что при таком кэшировании архитектура сайта или приложения всегда должна однотипно обрабатывать входящие запросы и отдавать однотипные ответы. Такое состояние есть в любом приложении или сайте, его нужно лишь отследить и применить к нему кэш.
Кэширование страниц целиком, чаще всего, применяют в каких-то экстренных случаях, при этом кэш страниц сохраняется на заранее указанное время (от 2 минут), в течение которого ответы от сервера однотипны (не позволяйте браузеру кэшировать это).
2.2 Кэширование результатов компиляции php-файлов
Различают как чистую компиляцию кода, так и его оптимизацию во время компилирования (подмена скриптов). Наиболее яркие примеры:
И тот и другой вид кэширования могут использоваться в проекте, но у каждого есть собственные нюансы, которые необходимо учитывать при написании кода.
2.3 Кэширование отдельных блоков страницы
Это, пожалуй, самый интересный, но и сложный вид кэширования. Тем не менее, он тоже может быть эффективным, и на его примере легче всего объяснить принципы кэширования в целом.
Необходимо отслеживать: состояние таблиц, состояние сессии пользователя, выключать ли кэширование при POST или GET запросах (http query), зависимость от текущего адреса, постоянство кэширования (при изменении предыдущих условий) или его динамическую подстройку.
Кэширование отдельных блоков страниц лучше других типов кэширования подойдёт, если вам нужно, например, уменьшить количество запросов к базе данных от реальных (авторизованных) пользователей. Кстати, при правильно заданных зависимостях, он будет работать даже эффективнее, чем все последующие виды кэширования.
Почему этот вид кэширования настолько важен? Всё дело в том, что расширение пула серверов баз данных намного более сложная задача, чем расширение пула серверов php-части сайта. Более того, php конфликты состояния кэширования решаются гораздо легче, чем конфликты при работе с множеством баз данных.
2.4 Кэширование php на основе неразделяемых ресурсов
Лучше всего подходит при стандартизации запросов, получении данных из общих ресурсов, наличии внутренних переменных, к которым php-ресурсы обращаются несколько раз при генерации страницы.
2.5 Кэширование php на основе общих ресурсов
Такое кэширование применяйте для хранения сериализированных данных. Например: конфигурационного файла, состояния таблиц, списков файловой системы.
2.6 Кэширование mysql на основе query cache
Это довольно известная и наиболее освещённая тема. Тем не менее, хотелось бы рассмотреть специфику работы с timestamp и то, как можно избежать постоянного сброса query cache.
Наверняка, вы регулярно сталкивались с ситуацией, когда необходимо отдать новые материалы, дата публикации которых уже разрешена текущим timestamp? Проще говоря,
Что такое браузерный кэш
(cache) браузера — это папка с копиями некоторых данных со страниц, которые вы посещали. Обычно в кеше сохраняются те элементы страницы, которые вряд ли успели измениться за промежуток времени между двумя запросами, — музыка, видео, изображения, стили, скрипты. Когда вы снова откроете ту же самую страницу, Яндекс.Браузер не будет запрашивать данные из интернета, а получит их из кеша. Страница откроется быстрее, а нагрузка на сеть снизится.
Пример использования кеша
Когда вы запускаете онлайн-видео, оно загружается быстрее, чем воспроизводится. Загруженные ролики сохраняются в кеше на компьютере. Поэтому после полной загрузки вы досмотрите видео даже без подключения к интернету.
Как очистить кеш
Чтобы очистить кеш:
Где находится кеш браузера
Чтобы просмотреть или скопировать кеш Яндекс.Браузера (например, для технической поддержки ), откройте папки:
| Операционная система | Адрес кеша |
|---|---|
| Windows 7, Windows 8, Windows 10 | C:\\Пользователи\\Имя вашей учетной записи\\AppData\\Local\\Yandex\\YandexBrowser\\User Data\\Default\\Cache |
/Library/Application Support/Yandex/YandexBrowser/Default/GPUCache
| Операционная система | Адрес кеша |
|---|---|
| Windows 7, Windows 8, Windows 10 | C:\\Пользователи\\Имя вашей учетной записи\\AppData\\Local\\Yandex\\YandexBrowser\\User Data\\Default\\Cache |
/Library/Application Support/Yandex/YandexBrowser/Default/GPUCache
Кеш хранится только на одном устройстве, при синхронизации устройств он не переносится.
Что такое кеш
(cache) браузера — это папка с копиями некоторых данных со страниц, которые вы посещали. Обычно в кеше сохраняются те элементы страницы, которые вряд ли успели измениться за промежуток времени между двумя запросами, — музыка, видео, изображения, стили, скрипты. Когда вы снова откроете ту же самую страницу, Яндекс.Браузер не будет запрашивать данные из интернета, а получит их из кеша. Страница откроется быстрее, а нагрузка на сеть снизится.
Пример использования кеша
Когда вы запускаете онлайн-видео, оно загружается быстрее, чем воспроизводится. Загруженные ролики сохраняются в кеше на компьютере. Поэтому после полной загрузки вы досмотрите видео даже без подключения к интернету.
Как очистить кеш
Чтобы очистить кеш:
Где находится кеш браузера
Чтобы просмотреть или скопировать кеш Яндекс.Браузера (например, для технической поддержки ), откройте папки:
| Операционная система | Адрес кеша |
|---|---|
| Windows 7, Windows 8, Windows 10 | C:\Пользователи\Имя вашей учетной записи\AppData\Local\Yandex\YandexBrowser\User Data\Default\Cache |
/Library/Application Support/Yandex/YandexBrowser/Default/GPUCache
| Операционная система | Адрес кеша |
|---|---|
| Windows 7, Windows 8, Windows 10 | C:\Пользователи\Имя вашей учетной записи\AppData\Local\Yandex\YandexBrowser\User Data\Default\Cache |
/Library/Application Support/Yandex/YandexBrowser/Default/GPUCache
Кеш хранится только на одном устройстве, при синхронизации устройств он не переносится.
Что такое браузерный кэш
(cache) браузера — это папка с копиями некоторых данных со страниц, которые вы посещали. Обычно в кеше сохраняются те элементы страницы, которые вряд ли успели измениться за промежуток времени между двумя запросами, — музыка, видео, изображения, стили, скрипты. Когда вы снова откроете ту же самую страницу, Яндекс.Браузер не будет запрашивать данные из интернета, а получит их из кеша. Страница откроется быстрее, а нагрузка на сеть снизится.
Пример использования кеша
Когда вы запускаете онлайн-видео, оно загружается быстрее, чем воспроизводится. Загруженные ролики сохраняются в кеше на компьютере. Поэтому после полной загрузки вы досмотрите видео даже без подключения к интернету.
Как очистить кеш
Чтобы очистить кеш:
Где находится кеш браузера
Чтобы просмотреть или скопировать кеш Яндекс.Браузера (например, для технической поддержки ), откройте папки:
| Операционная система | Адрес кеша |
|---|---|
| Windows 7, Windows 8, Windows 10 | C:\\Пользователи\\Имя вашей учетной записи\\AppData\\Local\\Yandex\\YandexBrowser\\User Data\\Default\\Cache |
/Library/Application Support/Yandex/YandexBrowser/Default/GPUCache
| Операционная система | Адрес кеша |
|---|---|
| Windows 7, Windows 8, Windows 10 | C:\\Пользователи\\Имя вашей учетной записи\\AppData\\Local\\Yandex\\YandexBrowser\\User Data\\Default\\Cache |
/Library/Application Support/Yandex/YandexBrowser/Default/GPUCache
Кеш хранится только на одном устройстве, при синхронизации устройств он не переносится.
Что такое кеш
(cache) браузера — это папка с копиями некоторых данных со страниц, которые вы посещали. Обычно в кеше сохраняются те элементы страницы, которые вряд ли успели измениться за промежуток времени между двумя запросами, — музыка, видео, изображения, стили, скрипты. Когда вы снова откроете ту же самую страницу, Яндекс.Браузер не будет запрашивать данные из интернета, а получит их из кеша. Страница откроется быстрее, а нагрузка на сеть снизится.
Пример использования кеша
Когда вы запускаете онлайн-видео, оно загружается быстрее, чем воспроизводится. Загруженные ролики сохраняются в кеше на компьютере. Поэтому после полной загрузки вы досмотрите видео даже без подключения к интернету.
Как очистить кеш
Чтобы очистить кеш:
Где находится кеш браузера
Чтобы просмотреть или скопировать кеш Яндекс.Браузера (например, для технической поддержки ), откройте папки:
| Операционная система | Адрес кеша |
|---|---|
| Windows 7, Windows 8, Windows 10 | C:\Пользователи\Имя вашей учетной записи\AppData\Local\Yandex\YandexBrowser\User Data\Default\Cache |
/Library/Application Support/Yandex/YandexBrowser/Default/GPUCache
| Операционная система | Адрес кеша |
|---|---|
| Windows 7, Windows 8, Windows 10 | C:\Пользователи\Имя вашей учетной записи\AppData\Local\Yandex\YandexBrowser\User Data\Default\Cache |
/Library/Application Support/Yandex/YandexBrowser/Default/GPUCache
Кеш хранится только на одном устройстве, при синхронизации устройств он не переносится.
Что такое кэш и зачем его чистить
Это старые данные, которые уже могут быть неактуальны
Когда не работает какой-то сайт или сервис, от техподдержки часто можно услышать «Почистите кэш и перезагрузите страницу». Иногда это помогает. Рассказываем, почему так происходит, что такое кэш, зачем он нужен и как его почистить.
⚠️ Минутка грамотности. По словарю РАН слово cache в русском пишется «кеш». Но по рекомендациям Гиляревского нужно писать «кэш». И нам нравится, как это произносится. Произнесите вместе с нами:
Что такое кэш
Кэш — это данные, которые компьютер уже получил и использовал один раз, а потом сохранил на будущее. Смысл кэша в том, чтобы в следующий раз взять данные не с далёкого и медленного сервера, а из собственного быстрого кэша. То же самое, что закупиться продуктами на неделю и потом ходить не в магазин, а в холодильник.
В случае с браузером это работает так:
Дальше происходит так:
4. Если вкладкой или браузером долго не пользовались, операционная система выгружает из оперативной памяти все страницы, чтобы освободить место для других программ.
5. Если переключиться назад на браузер, он моментально сходит в кэш, возьмёт оттуда загруженную страницу и покажет её на экране.
Получается, что если браузер будет брать из кэша только постоянные данные и скачивать с сервера только что-то новое, то страница будет загружаться гораздо быстрее. Выходит, главная задача браузера — понять, какой «срок годности» у данных в кэше и через какое время их надо запрашивать заново.
👉 Например, браузер может догадаться, что большая картинка на странице вряд ли будем меняться каждые несколько секунд, поэтому имеет смысл подержать её в кэше и не загружать с сервера при каждом посещении. Поэтому в кэше часто хранятся картинки, видеоролики, звуки и другие декоративные элементы страницы.
👉 Для сравнения: браузер понимает, что ответ сервера на конкретный запрос пользователя кэшировать не надо — ведь ответы могут очень быстро меняться. Поэтому ответы от сервера браузер не кэширует.
Какая проблема с кэшем
На первый взгляд кажется, что кэш — это прекрасно: данные уже загружены, к ним можно быстро обратиться и достать оттуда всё, что нужно, без запроса к серверу на другом конце планеты.
Но представьте такую ситуацию: вы заходите в интернет-магазин обуви, в котором покупали уже много раз, но товары почему-то не добавляются в корзину. Или добавляются, но кнопка «Оплатить» не работает. Чаще всего причина в том, что браузер делает так:
Решение — почистить кэш
Когда мы чистим кэш, оттуда удаляются все данные, которые браузер сохранил «на всякий случай». Это значит, что при обновлении страницы браузер заглянет в кэш, увидит, что там пусто и запросит все данные с сервера заново. Они, конечно, тоже сразу отправятся в кэш, но в следующий раз вы уже будете знать, что делать.
Чтобы очистить кэш в Сафари, достаточно нажать ⌥+⌘+E, а в Хроме — нажать Ctrl+Shift+Backspace (⇧+⌘+Backspace) и выбрать время, в пределах которого нужно очистить кэш:
Зачем нужен кэш, если из-за него всё ломается?
На самом деле всё ломается не из-за кэша, а из-за неправильных настроек сервера, которые отдают страницу. Потому что именно сервер должен сказать браузеру: «Вот это можно кэшировать, а вон то лучше не кэшируй, мало ли что».
Часто разработчики недокручивают эти настройки, и браузер не получает нужных инструкций, поэтому кэширует всё подряд. И тогда приходится вмешиваться, чистить кэш и восстанавливать работоспособность.