Как исправить проблему с кешированием браузера в WordPress?

Инструмент Google PageSpeed ​​Insights – один из способов измерить скорость вашего сайта WordPress. Как правило, показатель скорости Google отличается от других популярных инструментов измерения скорости, таких как Pingdom или Gtmetrix. Но рекомендуется отслеживать рейтинг Google, так как он может напрямую повлиять на рейтинг в результатах поиска.

При проверке своего сайта в Google PageSpeed ​​вы увидите некоторые частые проблемы, такие как оптимизация изображений, использование кеширования браузера, включение сжатия и т.д. В наших предыдущих статьях мы объяснили, как исправить проблемы включения сжатия и оптимизации изображений. В этой статье мы обсудим, как исправить проблему с кешированием браузера в WordPress.

Что такое кеширование браузера?

Поясним на примере. Откройте веб-браузер, например Google Chrome, и очистите историю просмотров. Теперь откройте любой веб-сайт, и вы увидите, что страница загружается медленно. Когда вы перемещаетесь по разным страницам одного и того же сайта, вы заметите, что страницы загружаются быстрее, чем в первый раз. Вот что произойдет в браузере:

• Браузер будет получать все статические ресурсы, такие как изображения, стили, сценарии и т.д., С веб-сервера во время первой загрузки сайта.
• Если на сайте включено кеширование в браузере для статических ресурсов, браузер будет следовать инструкциям сервера, полученным через заголовки HTTP.
• Браузер будет хранить статические ресурсы в локальном хранилище с указанием даты истечения срока или максимального возраста, полученного с сервера.
• Статические ресурсы извлекаются из локального хранилища браузера при загрузке следующей страницы.
• Если кеширование браузера не включено на сайте (время истечения срока действия не установлено), браузер будет получать файлы каждый раз при загрузке. Это увеличит время загрузки страницы, а также нагрузку на сервер.
• Срок годности должен быть указан для каждого типа файлов, например png, jpg, css. js и т. д.

Если вы не установите срок действия для изображений и других статических файлов, инструмент Google PageSpeed ​​Insights покажет это как высокоприоритетную проблему в категориях «Следует исправить» или «Возможные оптимизации».

Воспользуйтесь проблемой кеширования браузера в Google PageSpeed

Вы можете увидеть информацию в скобках рядом с URL-адресами изображений как «срок действия не указан».

Как исправить проблему с кешированием браузера в WordPress?

Есть два простых способа исправить проблему с кешированием браузера:

• Без плагина, изменив файл .htaccess
• Использование плагина W3 Total Cache

1 Без плагина

Войдите в свой FTP- клиент и откройте файл .htaccess, расположенный в корневом каталоге вашего сайта. Обратитесь к нашей статье, чтобы узнать больше о том, как редактировать файл .htaccess в WordPress. Добавьте в конец файла следующие директивы:

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType text/html "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 1 month"
</IfModule>

## CACHE CONTROL ##
<filesMatch ".(css|jpg|jpeg|png|gif|js|ico)$">
Header set Cache-Control "max-age=2592000, public"
</filesMatch>

Первый блок предназначен для истечения срока действия кеша, а второй – для управления кешем. В директиву включены все общие расширения файлов, вы также можете включить другие, если это необходимо для вашего сайта.

Если у вас нет доступа к FTP, есть плагины для редактирования файла .htaccess прямо из панели администратора. Например, плагин Yoast SEO предлагает возможность редактора файлов для редактирования файла .htaccess из панели администратора.

2 Использование W3 Total Cache

К счастью, в WordPress есть плагины для решения всех проблем. Чтобы решить проблему с кешированием при просмотре на вашем сайте WordPress, мы рекомендуем использовать плагин W3TC. W3TC – популярный плагин для кеширования, доступный в репозитории плагинов WordPress бесплатно с множеством дополнительных опций.

Плагин W3 Total Cache для WordPress

Установите плагин и активируйте его. Перейдите в раздел «Производительность> Кэш браузера» и включите все параметры, связанные с кешированием браузера, в разделах «Общие», «CSS и JS», «HTML и XML», «Медиа и другие файлы».

Включить кеширование браузера в плагине W3TC

Вы можете оставить поле «Истекает срок действия заголовка» с предварительно заполненными значениями по умолчанию в секундах. Если хотите, измените свои собственные значения в разделах «CSS и JS», «HTML и XML» и «Мультимедиа и другие файлы».

• 31536000 за 1 месяц
• 604800 на 1 неделю
• 86400 за 1 день
• 3600 за 1 час

Насколько мы тестировали, 1 час для HTML и XML и 1 месяц для других файлов отлично работают для Google PageSpeed.

Плагин W3T Totoal Cache по существу добавляет директивы в файл .htaccess, как описано в первом методе. Откройте файл .htaccess, и вы увидите, что длинный набор директив добавлен плагином W3TC. Все директивы, связанные с кешированием браузера, показаны между разделами «# BEGIN W3TC Browser Cache» и «# END W3TC Browser Cache».

Вернитесь в Google PageSpeed ​​Insights

После того, как вы вручную добавили код в файл .htaccess или активировали кеширование в браузере всех типов объектов в W3TC, сначала очистите все свое кеширование. Затем вернитесь к инструменту Google PageSpeed ​​Insights и проверьте страницу. Скорее всего, проблему следовало решить или переместить в более низкий приоритет в разделе «Рассмотреть возможность исправления», как показано ниже. Новый инструмент PageSpeed ​​по-прежнему будет показывать проблемы в разделе «Возможные оптимизации» с улучшенной общей оценкой.

В нашем примере проблема все еще существует из-за объявлений AdSense и файлов шрифтов.

Приоритет проблемы с кешированием в браузере снижен

Чего нельзя делать с кешированием браузера

Теперь, когда вы знаете, как исправить проблему с кешированием браузера на вашем сайте WordPress. Но в большинстве случаев этого недостаточно, потому что он будет работать только для статических ресурсов, загруженных из вашего собственного домена. На самом деле на странице может быть много других внешних ресурсов, которые нельзя кэшировать в браузере. Ниже приведены некоторые из популярных внешних ресурсов, которые могут вызвать проблемы с кешированием браузера:

• Скрипт кода отслеживания Google Analytics
• Скрипт рекламного кода Google AdSense (как показано в приведенном выше примере)
• Некоторые файлы шрифтов
• Изображения Gravatar на биографию автора и комментарии
• Изображения загружены социальными плагинами

Если скорость сайта является для вас наиболее важным фактором, осторожно используйте внешние ресурсы на своем сайте. Возможно, вы можете отключить все внешние ресурсы, кроме важных, таких как Google Analytics, чтобы улучшить показатель скорости страницы.