Введение в HTTP-кеширование
Я уверен, что вы заметили, что когда вы открываете веб-сайт в первый раз, загрузка занимает некоторое время. Однако, когда вы снова открываете его через некоторое время, сайт загружается гораздо быстрее. Представьте себе, что если бы сайт каждый раз загружался в одно и то же время, то как бы вы чувствовали себя медленно. Ну, это все благодаря изящной идее под названием HTTP Caching. Давайте посмотрим, что это такое, как оно работает и как оно используется для ускорения работы в Интернете.
Что такое HTTP-кеширование?
HTTP-кэширование - это идея хранения некоторых часто используемых или часто используемых данных в месте, к которому есть быстрый доступ. При этом есть очень хороший шанс, что наиболее необходимые данные могут быть доступны намного быстрее, потому что компьютеру не нужно заходить слишком далеко, чтобы их получить.
В случае просмотра веб-страниц кэширование рассматривается, когда ваш веб-браузер, такой как Chrome, сохраняет копию веб-сайта или веб-приложения в локальном хранилище. После кэширования веб-сайта веб-браузеру не нужно повторно загружать все данные с сервера, и это значительно ускорит просмотр.
Например, после загрузки файла CSS веб-сайта браузеру не нужно загружать его для каждой страницы сеанса. То же самое можно сказать о многих файлах JavaScript, изображениях (таких как логотип сайта и значки социальных сетей) и даже некоторых динамических материалах. Кэширование включается с помощью заголовков Cache.
Заголовки кэша в HTTP
HTTP-кэширование имеет два основных заголовка кэша: первый называется «Cache-Control», а второй - «Expire». Давайте посмотрим на оба:
Cache-Control
Вы можете рассматривать Cache-Control как переключатель для включения кэширования в браузере пользователя. После добавления этого заголовка он включает кэширование для всех поддерживаемых веб-браузеров. Если этот заголовок отсутствует, браузер не будет хранить кеш содержимого веб-страницы, даже если он поддерживает кеширование.
Cache-control имеет два типа настроек конфиденциальности: первый - Public, а второй - Private.
В случае Public ресурсы могут быть кэшированы любым промежуточным прокси-сервером, таким как сети доставки контента (CDN).
Заголовок Cache-Control с приватным ответом сообщит браузеру, что кэширование будет выполняться только для одного пользователя, а не для любого промежуточного прокси.
Значение «max-age» в заголовке Cache-Control устанавливает время, в течение которого контент будет кешироваться. Это время в секундах.
Cache-Control:public, max-age=31536000
Истекает
Заголовок Expires используется, когда в коде присутствует Cache-Control. Это простой заголовок HTTP Cache, который устанавливает дату, с которой любой ресурс кэша считается недействительным. Когда срок действия кэша истечет, и пользователь загрузит сайт, веб-браузер просто запросит все содержимое страницы еще раз.
Условные Запросы
Вышеупомянутые заголовки просто сообщают браузеру, когда извлекать данные с веб-сервера. С другой стороны, условные запросы сообщают браузеру, как его получить. Условные запросы сообщают браузеру, как он может запрашивать у сервера, является ли копия данных в кэше устаревшей.
В этом процессе браузер отправляет некоторые данные о ресурсах, которые он кэшировал, в свою память, и после чтения этих данных сервер решает, являются ли данные устаревшими или нет.
Запросы, основанные на времени
В основанных на времени запросах проверяется, был ли запрошенный ресурс изменен на сервере или нет. Если кэшированная копия в браузере является самой последней, сервер вернет код 304.
Чтобы установить условный запрос по времени, вы можете использовать «Last-Modified» в заголовке ответа.
Cache-Control:public, max-age=25998579
Last-Modified: Fri, 08 Jul 2018 15:25:00 GMT
Content-Based
В запросах на основе содержимого хэш MD5 (или любой другой жизнеспособный параметр) проверяется как для копии сервера, так и для копии кэша. Это говорит о том, совпадают ли данные или нет, в случае, если данные отличаются, контрольная сумма MD5 не будет совпадать, и сервер отправит свежую копию ресурсов.
Это делается через «ETag» в шапке. Ценность этого - дайджест ресурсов.
Cache-Control:public, max-age=25998579
ETag: "496d7131f15f0fff99ed5aae”
видимость
Почти все современные браузеры включают некоторые инструменты, связанные с разработкой, которые позволяют вам проверять ресурсы, исходный код и другие аспекты веб-страницы. Среди них вы можете найти инструмент для просмотра заголовков, возвращаемых любым приложением.
В Google Chrome, чтобы увидеть эти заголовки, вы можете щелкнуть правой кнопкой мыши в любой пустой области веб-страницы и нажать «Осмотреть» или нажать CTRL + SHIFT + I, чтобы открыть DevTools. В этом инструменте нажмите на вкладку Сеть и нажмите CRTL + R, чтобы перезагрузить, чтобы увидеть все заголовки страницы.
Примеры использования в HTTP-кешировании
Ниже приведены некоторые примеры использования HTTP-кэширования:
Для статических активов
Для статических ресурсов страницы, таких как изображения, JS-файлы и любые CSS-файлы, вы можете активно кэшировать содержимое. Отсутствие необходимости загрузки этих файлов приведет к впечатляющему улучшению производительности. В этом случае используйте заголовок Cache-Control со значением максимального возраста, превышающим месяц или даже год.
Cache-Control:public; max-age=31536000
Для динамического содержания
В случае динамического содержимого страницы, вам нужно будет самостоятельно подумать, какие файлы должен кэшироваться браузером и как долго. В случае частого изменения содержимого вам необходимо убедиться, что продолжительность, выбранная вами для кэширования, не приведет к каким-либо проблемам для пользователя.
Кеширование частного контента
Как мы уже обсуждали в разделе Cache-Control, в случае, если содержимое страницы является частным по своей природе, вы можете предотвратить его кэширование промежуточными прокси-серверами, такими как CDN, добавив «Cache-Control: private» в заголовок.
Другой более безопасный подход - вообще не кэшировать какой-либо частный контент.
Реализация HTTP-кеширования
Теперь, когда вы знаете, что такое HTTP-кеширование и как оно работает, давайте посмотрим, как вы можете реализовать его на своем веб-сайте. Реализация HTTP-кэширования немного отличается для разных типов серверов. В нашем случае давайте рассмотрим реализацию кэширования через файл .htaccess.
Чтобы включить кэширование на сайте, вы можете добавить заголовки в файл .htaccess на вашем сервере, например:
FilesMatch "\.(ico|pdf|flv|jpg.webp|jpeg.webp|png|gif|js|css|swf)$"
Header set Cache-Control "max-age=31536000, public"
/FilesMatch
Выше будет кэшировать все файлы, pdf, flv, jpg.webp и другие упомянутые форматы, упомянутые в «File Match», на один год.
Вывод
HTTP-кэширование является одним из наиболее важных приемов, которые делают просмотр вашего сайта более быстрым для ваших посетителей, и теперь, когда вы можете увидеть, как он работает, вы можете внедрить его на своих сайтах и в веб-приложениях, чтобы сделать их быстрее для ваших пользователей и для сохранения пропускной способности вашего сервера.
Рекомендуемые статьи
Это было руководство по кешированию HTTP. Здесь мы обсудили реализацию, условные запросы, заголовок кэша и варианты использования HTTP. Вы также можете просмотреть наши другие предлагаемые статьи, чтобы узнать больше -
- Узнайте, что такое HTML
- Как установить Github?
- Что такое MapReduce в Hadoop?
- Руководство для начинающих по Node Commands
- HTTP Cookies | Безопасность