Як налаштувати кешування в браузері сайту на WordPress

Кешування є одним з найбільш ефективних способів забезпечення того, щоб ваш сайт завантажувався швидше. Однак для досягнення оптимальних результатів ваш сайт повинен точно вказувати браузерам, який контент їм необхідно кешувати. І часто це доводиться вказувати вручну.

На щастя, зробити це досить просто, навіть початківцям. Все, що вам потрібно, це внести кілька змін до кореневого файлу .htaccess. У сьогоднішній статті ми докладніше поговоримо про те, що таке кешування в браузері, як перевірити, чи правильно воно використовується на вашому сайті, і як його налаштувати.

 

 

Кешування в браузері

В ідеалі, коли хтось відвідує ваш сайт, його браузер зберігає частину вмісту в локальному сховищі (на комп’ютері користувача), тому при наступних відвідуваннях цей контент береться звідти. Ця практика відома як «кешування в браузері», і ось основні моменти її користі:

• Кешування зменшує час завантаження сайту. Чим менше ресурсів завантажує користувач, тим швидше повинен відображатися ваш сайт.
• Потенційно більш низькі показники відмов. Існує пряма залежність між часом завантаження і частотою відмов. Чим вище перший показник, тим більша ймовірність того, що відвідувачі закриють ваш сайт.
• Воно зменшує навантаження на ваш сервер. Оскільки постійним відвідувачам не потрібно завантажувати контент з вашого сервера, навантаження на нього зменшується.

 

Важливо розуміти, що в більшості випадків вам не потрібно все кешувати. Сучасні сайти містять багато інтерактивного контенту, який постійно оновлюється. Це означає, що якщо кешуються цілі сторінки, користувачі можуть втратити важливі зміни.

З огляду на це, вам потрібно вибрати контент, який браузер може кешувати. Наприклад, картинки, логотипи і файли CSS стилів змінюються не часто. Це означає, що ви можете дати вказівку браузерам кешувати ці файли і визначити час життя їх кеша. В ідеалі конфігурація кешування вашого сайту повинна розрізняти типи файлів, для яких трапляються, або ні, регулярні оновлення. Таким чином, користувачам не потрібно буде очищати свій кеш вручну, щоб побачити зміни, які ви внесли на свій сайт.

 

 

Як перевірити, чи правильно налаштовано кешування в браузері

Коли ми говоримо про використання кешування, ми говоримо про налаштування вашого сайту, щоб браузери знали, який контент їм потрібно зберігати локально та як довго. Найпростіший спосіб з’ясувати, чи правильно сайт використовує кешування в браузері, — використовувати такий інструмент, як Google PageSpeed ​​Insights, який аналізує цей та інші параметри. Для цього введіть URL вашого сайту в цьому інструменті та натисніть кнопку Аналіз.

PageSpeed ​​Insights оцінить оптимізацію вашого сайту як для мобільних, так і для настільних ПК. Для кожної версії вашого сайту ви отримаєте індивідуальний бал від 0 до 100, а також пропозиції щодо його поліпшення. При підрахунку балів PageSpeed ​​Insights враховує один з ключових чинників – чи використовує ваш веб-сайт кешування в браузері.

Якщо ви правильно налаштували свій сайт на WordPress, ви не побачите вищезгадане повідомлення, і ви повинні отримати достойний бал PageSpeed ​​Insights.

 

 

Як вручну налаштувати кешування в браузері для сайту на WordPress

Перед тим, як продовжити, ви повинні створити свіжу резервну копію вашого сайту про всяк випадок!

 

Крок №1: Увійдіть на свій сервер по FTP

Нам потрібно відредагувати файл .htaccess в корені сайту. Для доступу до цього файлу на сервері, ви можете використовувати FTP. У цій статті ви знайдете достатньо інформації по використанню FTP.

 

 

Крок №2: Відредагуйте файл .htaccess

Файл .htaccess – це файл, який інструктує ваш сервер, як він повинен обслуговувати файли і сторінки. З його допомогою, наприклад, ви можете налаштувати доступ до певних сторінок для певних IP-адрес та багато іншого.

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

Знайдіть рядок # END WordPress. Додайте наведений нижче код прямо перед цим рядком. Ось приклад простої конфігурації кешування браузера, яку ви можете реалізувати одразу:

<IfModule mod_expires.c>
 ExpiresActive On
 ExpiresByType image/jpg "access 1 month"
 ExpiresByType image/jpeg "access 1 month"
 ExpiresByType image/gif "access 1 month"
 ExpiresByType image/png "access 1 month"
</IfModule>

 

 

В даному прикладі ми вказуємо зберігати картинки (з розширенням jpg, jpeg, gif та png) в кеші браузера один місяць. Перша половина кожного рядка вказує тип файлу, з яким ми маємо справу, а друга встановлює термін дії для нього:

ExpiresByType image/jpg "access 1 month"

 

 

Звичайно, не весь контент повинен кешуватися протягом місяця, тому ми можемо пограти з цим значенням. У прикладі нижче ми додали інструкції для кешування картинок, файлів HTML, CSS та JavaScript з різними значеннями:

<IfModule mod_expires.c>
 ExpiresActive On
 ExpiresByType image/jpg "access 1 month"
 ExpiresByType image/jpeg "access 1 month"
 ExpiresByType image/gif "access 1 month"
 ExpiresByType image/png "access 1 month"
 ExpiresByType text/css "access 1 week"
 ExpiresByType text/html "access 1 month"
 ExpiresByType text/x-javascript "access 1 week"
 ExpiresDefault "access 1 month"
</IfModule>

 

 

Тут ми встановлюємо різний час зберігання для різних типів контенту.

Останній рядок, що починається з ExpiresDefault, встановлює час кешування за замовчуванням (на один місяць) для всіх ваших файлів. Однак ви можете перевизначити це, додавши інструкції кешування для певних типів файлів. Суть в тому, щоб врахувати й інші типи файлів, які можуть не відповідати загальним правилам.

Тепер не забудьте зберегти зміни в .htaccess файлі та закрити текстовий редактор.

Замініть новим файлом старий на сервері. Після цього спробуйте ще раз протестувати свій сайт за допомогою PageSpeed ​​Insights – рекомендацій щодо включення кешування в браузері не повинно бути!

 

 

 

Короткий підсумок

Ручне налаштування конфігурації кешування для контенту вашого сайту досить легке, навіть для початківців.

Все, що потрібно для налаштування кешування браузера вручну, — це внести кілька змін в файл .htaccess через FTP.

Потім ви можете протестувати свій веб-сайт за допомогою Google PageSpeed ​​Insights, щоб переконатися, що він правильно використовує кешування браузера.

Якщо у вас є питання про те, як вручну налаштувати кешування браузера для сайту на WordPress, задавайте їх в розділі коментарів нижче!

Дякуємо, що читаєте нас!