Вступ до кешування HTTP
Я впевнений, що ви помітили, що коли ви відкриваєте веб-сайт вперше, потрібно тривати деякий час. Однак, коли ви знову відкриєте його через деякий час, сайт забуває набагато швидше. Уявіть, якби кожен раз завантажувався один і той же час, як почуватиметься повільний перегляд. Ну, це все завдяки чудовій ідеї під назвою HTTP Caching. Давайте подивимося, що це таке, як він працює і як його використовують для того, щоб перегляд Інтернету був швидшим.
Що таке кешування HTTP?
HTTP-кешування - це ідея зберігання деяких часто використовуваних даних у іншому місці, до якого швидко отримати доступ. Завдяки цьому є дуже хороший шанс, що до найбільш необхідних даних можна отримати доступ набагато швидше, оскільки комп'ютер не повинен надто далеко добиратися до нього.
У разі веб-перегляду кешування вважається, коли ваш веб-браузер, такий як Chrome, зберігає копію веб-сайту чи веб-програми на локальній пам’яті. Після кешування веб-сайту веб-браузеру не доведеться повторно завантажувати всі дані з сервера, і це зробить перегляд набагато швидшим.
Наприклад, після завантаження CSS-файлу веб-сайту браузер не повинен завантажувати його на кожну сторінку сеансу. Те саме можна сказати для багатьох файлів JavaScript, зображень (таких як Логотип сайту та піктограм соціальних медіа) та навіть деякого динамічного контенту. Кешування вмикається за допомогою заголовків кеша.
Заголовки кешу в HTTP
HTTP кешування має дві основні заголовки кешу, перша називається "кеш-керування", а друга називається "закінчується". Давайте подивимось на обидва:
Кеш-контроль
Ви можете розглядати кеш-контроль як комутатор, щоб увімкнути кешування в браузері користувача. Після додавання цього заголовка він дозволяє кешувати всі підтримувані веб-браузери. Якщо цього заголовка немає, жоден браузер не зберігатиме кеш вмісту веб-сторінки, навіть якщо він підтримує кешування.
Кеш-контроль має два типи налаштувань конфіденційності, перший - загальнодоступний, а другий - приватний.
У випадку Public, ресурси можуть кешуватися будь-яким проміжним проксі-сервером, таким як Мережі доставки вмісту (CDN).
Заголовок кеша-керування з приватною відповіддю скаже браузеру, що кешування буде виконано лише для одного користувача, а не для проміжного проксі.
Значення "max-age" у заголовку Cache-Control задає час, протягом якого вміст буде кешеним. Цей час у секундах.
Cache-Control:public, max-age=31536000
Закінчується
Заголовок Expires використовується, коли в коді присутній Cache-Control. Це простий заголовок кеша HTTP, який встановлює дату, з якої будь-який ресурс кешу вважається недійсним. Після закінчення терміну дії кешу і користувач завантажує веб-сайт, веб-браузер просто ще раз запросить увесь вміст сторінки.
Умовні запити
Вище обговорювані заголовки просто повідомляють браузеру, коли потрібно отримати дані з веб-сервера. З іншого боку, умовні запити повідомляють браузеру, як його отримати. Умовні запити повідомляють браузеру, як він може запитати сервер, якщо копія даних у кеші застаріла.
У цьому процесі браузер надсилає деякі дані про кешовані ресурси у своїй пам'яті, і, прочитавши ці дані, сервер вирішує, застаріли дані чи ні.
Запити на основі часу
У запитах на основі часу перевіряється, чи був змінений запитуваний ресурс на сервері чи ні. Якщо кешована копія у браузері є останньою, сервер поверне код 304.
Щоб встановити умовний запит на час, ви можете скористатися "Останнє змінення" у заголовку відповіді.
Cache-Control:public, max-age=25998579
Last-Modified: Fri, 08 Jul 2018 15:25:00 GMT
На основі вмісту
У запитах, що базуються на вмісті, MD5 Hash (або будь-який інший життєздатний варіант) перевіряється як на копію сервера, так і на кешування. Це говорить про те, чи дані однакові чи ні, у випадку, якщо дані відрізняються, контрольна сума MD5 не збігатиметься і сервер надішле нову копію ресурсів.
Це робиться через "ETag" у заголовку. Цінність його - дайджест ресурсів.
Cache-Control:public, max-age=25998579
ETag: "496d7131f15f0fff99ed5aae”
Видимість
Майже у всіх сучасних браузерах є деякі інструменти, пов'язані з розробкою, які дозволяють перевіряти ресурси, вихідний код та інші аспекти веб-сторінки. Серед них ви можете знайти інструмент, щоб побачити заголовки, повернені будь-якою програмою.
У Google Chrome, щоб побачити ці заголовки, можна клацнути правою кнопкою миші будь-яку порожню область веб-сторінки та натиснути «Перевірити» або натиснути CTRL + SHIFT + I, щоб відкрити DevTools. У цьому інструменті натисніть на вкладку Мережа та натисніть CRTL + R, щоб перезавантажити, щоб побачити всі заголовки сторінки.
Використовуйте випадки кешування HTTP
Нижче наведено кілька випадків використання кешування HTTP, які наведені нижче:
Для статичних активів
Для статичних ресурсів сторінки, таких як зображення, файли JS та будь-які CSS-файли, ви можете налаштувати агресивне кешування вмісту. Якщо не завантажувати ці файли, це призведе до вражаючого підвищення продуктивності. Для цього випадку перейдіть до заголовка кеш-керування з максимальним віковим значенням більше місяця чи навіть року.
Cache-Control:public; max-age=31536000
Для динамічного змісту
Що стосується динамічного вмісту сторінки, вам потрібно буде самостійно подумати, які файли повинен кешувати браузер і на який термін. У випадку, якщо вміст буде часто змінюватися, вам потрібно буде переконатися, що тривалість часу, яке ви вибрали для кешування, не призведе до проблем із користувачем.
Кешування приватного контенту
Як ми обговорювали в розділі кеш-керування, якщо вміст сторінки має приватний характер, ви можете запобігти кешування ним проміжних проксі-серверів, таких як CDN, додавши у заголовку "кеш-контроль: приватне".
Ще один безпечніший підхід - взагалі не кешувати приватний вміст.
Впровадження кешування 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 та інші згадані формати, згадані у "Файловому збігу" протягом одного року.
Висновок
HTTP-кешування - це один з найважливіших прийомів, який робить перегляд вашого веб-сайту швидшим досвідом для відвідувачів, і тепер, коли ви можете побачити, як він працює, ви можете реалізувати його на своїх сайтах та веб-додатках, щоб зробити їх швидшими для своїх користувачів і для збереження пропускної здатності вашого сервера.
Рекомендовані статті
Це було керівництвом щодо кешування HTTP. Тут ми обговорили реалізацію, умовні запити, заголовок кешу та випадки використання HTTP. Ви також можете ознайомитися з іншими запропонованими нами статтями, щоб дізнатися більше -
- Дізнайтеся, що таке HTML
- Як встановити Github?
- Що таке MapReduce в Hadoop?
- Керівництво для початківців команд "Вузол"
- HTTP cookies | Безпека