Статьи

Як включити кеш браузера

  1. Модулі Apache: mod_headers і mod_expires
  2. Директиви кешування для модуля mod_headers
  3. Директиви кешування для модуля mod_expires

Всім привіт! сьогодні на seo-mayak.com я продовжу розбирати рекомендації PageSpeed щодо прискорення завантаження сайту і розповім, як включити кеш браузера на стороні відвідувача Вашого сайту.

Багато веб-майстри використовують для кешування даних різні кеш-плагіни. Найпопулярніші з них: W3 Total Cache, WP Super Cache і Hyper Cache.

Але я намагаюся без крайньої необхідності не використовувати плагіни, тому спочатку шукав варіант, який би дозволив мені включити кеш браузера іншими засобами.

Зізнаюся, що на пошуки «іншого засобу» я витратив багато часу, так як більшість статей на цю тему поверхневі, що викликало у мене ще більше питань.

З усього перечитав я зрозумів одне - кеш браузера можна включити за допомогою директив, що задаються у файлі .htaccess, які вкажуть сервера, які файли і на який час треба кешувати.

htaccess, які вкажуть сервера, які файли і на який час треба кешувати

На різних форумах і блогах пропонувалося маса варіантів, як змусити браузер запам'ятовувати і зберігати дані або як включити gzip стиснення і т.д. Голова йшла обертом, я ніяк не міг зрозуміти принцип дії тих чи інших директив і мені нічого не залишалося, як почати проводити експерименти, благо для цих цілей є Денвер .

Поступово приходило розуміння, що насамперед мені необхідно розібратися в модулях Apache (популярне серверне ПЗ), до яких і відбувається звернення через файл .htaccess. Як говоритися, чим далі в ліс, тим більше дров.

Я не переставав дивуватися, скільки знань повинен мати веб-майстер, щоб самостійно вести і обслуговувати свій проект. Всі звичайно знати неможливо, але до цього треба прагнути. Поїхали!

Модулі Apache: mod_headers і mod_expires

Перш за все треба з'ясувати, яке ПЗ використовується на Вашому хостингу. Як Ви напевно вже здогадалися, звернення до модулів mod_headers і mod_expires буде працювати тільки в тому випадку, якщо на серверах Вашого хостинг-провайдера встановлено ПО Apache.

Дані модулі не входять до стандартну збірку Apache і необхідно уточнити в службі підтримки хостингу, встановлені mod_headers і mod_expires на сервері. Якщо такі є, то можна приступати до написання директив.

Модулі mod_headers і mod_expires здатні вбудовувати в відповідь сервера спеціальні заголовки Cache-Control або Expires, які вкажуть браузеру на стороні відвідувача, які файли і на який час треба кешувати.

Важливо! Для того, щоб включити кеш браузера на стороні користувача досить написати директиви тільки для одного з модулів. Звернення до mod_headers і mod_expires одночасно, вважаю не доцільним!

Скажу більше. Тема Expires почав працювати з версією протоколу HTTP / 1.0, а заголовок Cache-Control був прийнятий на озброєння з виходом протоколу HTTP / 1.1.

Хоч Expires і був інтегрований в нову версію протоколу і його як і раніше розуміють сучасні браузери, але з появою Cache-Control, останній отримав пріоритет. Тобто, при отриманні браузером тимчасових директив, директиви Cache-Control скасовують директиви Expires.

Ось такі справи. Я розумію, що новачкам дуже складно засвоїти даний матеріал, адже я сам колись був «зеленим», але впевнений, що при наявності бажання можна розібратися в будь-якому питанні і якщо Ви дочитаєте статтю до кінця, то думаю багато що проясниться.

Для початку давайте розберемося з директивами, призначеними для модуля mod_headers.

Директиви кешування для модуля mod_headers

Ось такий код треба вставити в файл .htaccess. Щоб уникнути зайвих питань, вставляємо перед рядком # END WordPress:

# Включаємо кеш в браузерах відвідувачів <ifModule mod_headers.c> # Все html і htm файли будуть зберігатися в кеші браузера один день <FilesMatch "\. (Html ​​| htm) $"> Header set Cache-Control "max-age = 43200" </ FilesMatch> # Все css, javascript і текстові файли будуть зберігатися в кеші браузера один тиждень <FilesMatch "\. (js | css | txt) $"> Header set Cache-Control "max-age = 604800" </ FilesMatch> # Все флеш файли і зображення будуть зберігатися в кеші браузера один місяць <FilesMatch "\. (flv | swf | ico | gif | jpg | jpeg | png) $"> Header set Cache-Control "max-age = 2592000" </ FilesMatch> # Відключаємо кешування php та інших службових файлів <FilesMatch "\. (pl | php | cgi | spl | scgi | fcgi) $"> Header unset Cache-Control </ FilesMatch> </ IfModule>

Тепер я трохи поясню, що означають ті чи інші директиви.

<ifModule ...> ... </ IfModule> - це свого роду контейнер, який містить в собі директиви, призначені для того чи іншого модуля Apache і заодно перевіряє наявність оного. Якщо модуль не знайдено, то директиви ігноруються.

В даному випадки ми звертаємося до модуля mod_headers, вихідний файл якого носить назву mod_headers.c, де «.з» - розширення файлу.

<FilesMatch «...»> ... </ FilesMatch> - блокова директива, яка вказує сервера на файли з конкретними розширеннями, на які будуть поширюватися зазначені в директиві правила. В лапках, прописуються регулярні вирази, наприклад «\. (Html ​​| htm) $», за допомогою яких можна згрупувати файли з необхідними розширеннями.

Я зараз не буду розбирати синтаксис регулярних виразів, використовуваних в .htaccess, хоча тема дуже цікава і я їй краще присвячу окрему статтю, так що раджу підписатися на.

Header - директива, що впливає на відправку HTTP заголовка з боку сервера в мережу. Дана директива може прийняти такі аргументи: set, append, add, unset і echo. Всі аргументи я думаю описувати зовсім не обов'язково, хто хоче знати більше, читайте документацію. Розглянемо лише ті аргументи, які використовуються в нашому коді.

set - аргумент, який повідомляє браузеру або проміжного сервера (проксі-сервера), що будь-який попередній заголовок з тим же ім'ям повинен бути замінений. Якщо пояснити російською мовою - це команда браузеру, що при повторному запиті одного і того ж заголовка, діставати дані треба з власного кешу. Тобто, тим самим ми включаємо кеш браузера.

unset - аргумент повідомляє браузеру або проксі серверу, що будь-який заголовок з тим же ім'ям повинен бути отриманий з сервера. Напевно ви вже здогадалися, що даний аргумент - це ні що інше, як заборона кешування.

Cache-Control - заголовок, призначений для управління процесом кешування. Для заголовка Cache-Control може може бути прописано радий директив. Дуже докладний опис Cache-Control і його директив я знайшов тут, кому цікаво можете почитати.

max-age - директива, що задає термін придатності кеша. Після знака одно вказується час в секундах, протягом яких, зазначені файли повинні зберігається в кеші браузера.

Директиви кешування для модуля mod_expires

При зверненні до модуля mod_expires через файл .htaccess, ми будемо використовувати вже інші директиви (крім ifModule), які виглядають наступним чином:

<IfModule mod_expires.c> ExpiresActive On # за умовчанням кеш в 5 секунд ExpiresDefault "access plus 5 seconds" # Включаємо кешування зображень і флеш на місяць ExpiresByType image / x-icon "access plus 1 month" ExpiresByType image / jpeg "access plus 4 weeks "ExpiresByType image / png" access plus 30 days "ExpiresByType image / gif" access plus 43829 minutes "ExpiresByType application / x-shockwave-flash" access plus 2592000 seconds "# Включаємо кешування css, javascript і текстових файлів на один тиждень ExpiresByType text / css "access plus 604800 seconds" ExpiresByType text / javascript "access plus 604800 seconds" ExpiresByType application / javascript "access plus 604800 seconds" ExpiresByType application / x-javascript "access plus 604800 seconds" # Включаємо кешування html і htm файлів на один день ExpiresByType text / html "access plus 43200 seconds" # Включаємо кешування xml файлів на десять хвилин ExpiresByType application / xhtml + xml "access plus 600 seconds" </ ifModule>

З контейнером ifModule я думаю повинно бути все зрозуміло.

ExpiresActive - дана директива активує або блокує кешування на стороні браузера користувача.

on - активувати

off - блокувати

ExpiresDefault - цікава директива, яка здатна ставити час зберігання кешу в браузері за замовчуванням. Тобто, браузер буде кешувати все підряд. В лапках вказується часовий інтервал.

У директивах для модуля mod_expires синтаксис тимчасового інтервалу набагато гнучкіше, ніж для модуля mod_headers, де час задається тільки в секундах.

Для модуля mod_expires час можна встановлювати в наступний обчисленнях:

years - років або year - один рік
months - місяців або month - одні місяць
weeks - тижнів або week - один тиждень
days - днів або day - один день
hours - годин або hour один годину
minutes - хвилин або minute - одна хвилина
seconds - секунд

Перед тимчасовим інтервалом прописується кілька додаткових слів, наприклад:

"Access plus 1 month"

access - основне слово (основа). У перекладі з англ. - доступ;

plus - ключове слово (ключ), після якого має слідувати числове значення.

Часовий інтервал і додаткові слова обов'язково полягає в лапки. У відрізку коду, який був наведений вище, я спеціально, для прикладу, вказав часовий інтервал в різних обчисленнях. Сподіваюся буде зрозуміло. Йдемо далі.

ExpiresByType - директива, що задає часовий інтервал кешування для певних типів файлів. Перевагою даної директиви є те, що вона скасовує час кешу за замовчуванням, для зазначених типів файлів, встановленого директивою ExpiresDefault.

Також обов'язково через слеш вказується тип файлів, наприклад: image / jpeg, text / html або application / x-javascript. Всі типи файлів можна подивитися тут.

На закінчення хочу сказати, що існують і інші способи кешування. Кеш об'єктів можна організувати за допомогою функцій WordPress або за допомогою сторонніх серверів Memcached, APC або Redis.

Звичайно в майбутньому я не обійду увагою і ці теми, так що підписуйтесь на, буде цікаво!

До зустрічі!

З повагою, Віталій Кирилов

«Оптимізація WordPress. Навантаження на сервер і як її знизити
«PageSpeed ​​- реальне прискорення сайту
«Як включити gzip стиск і кратно прискорити сайт
«Як скоротити CSS і прискорити завантаження сайту

Новости

Как создать фото из видео
Кризис заставляет искать дополнительные источники дохода. Одним из таких источников может стать торговля на валютном рынке Форекс. Но чтобы не потерять свои деньги необходимо работать с надежным брокером.

Как оформить группу в вконтакте видео
Дано хотел свой магазин в вк, но не знал с чего начать его делать. Так как хотелось не банальный магазин с кучей ссылок и фото, а красиво оформленный. С меню, с аватаркой. После просмотра видео создал

Как оформить диск малыш от рождения до года из фото и видео
Оформить диск "Малыш от рождения до года" из фото и видео можно совершенно разными способами! Кто-то для достижения данной цели идет на шоу-таланты, кто-то пользуется услугами профессионалов, а кто-то