Как настроить кэширование в браузере сайта на 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, задавайте их в разделе комментариев ниже!

Спасибо, что читаете нас!