Как использовать кеширование браузера в WordPress (шаг за шагом)
Хотите реализовать кэширование браузера WordPress на своем веб-сайте?
Инструменты тестирования скорости сайта, такие как Google PageSpeed Insights, GTmetrix и Pingdom, предлагают использовать кеш браузера, поскольку это невероятно эффективный способ ускорить работу веб-сайта WordPress. 🚀
Кэширование браузера — это процесс, используемый для временного хранения данных в браузере, поэтому доступ к ним можно получить быстрее, без необходимости загружать страницу каждый раз, когда вы хотите ее просмотреть.
Есть несколько способов реализовать кеширование браузера на веб-сайте WordPress. Мы рассмотрели их все в статье ниже. Давайте погрузимся. 🤿
Как использование кэша браузера повышает скорость сайта?
Чтобы понять, как использование кэша браузера повышает скорость сайта, вам необходимо сначала узнать, как веб-страница загружается в браузере.
Веб-страница состоит из многочисленные элементы: текст, медиа, виджеты, верхний и нижний колонтитулы и т. д.
Когда вы открываете веб-страницу, ваш браузер отправляет несколько запросов к хост-серверу сайта для загрузки всех элементов страницы.
Сервер возвращает эти запросы с соответствующими данными, которые затем отображаются в браузере.
Как вы можете себе представить, весь процесс занимает некоторое время, и в зависимости от количества элементов на вашей веб-страницевашему веб-сайту может потребоваться некоторое время для полной загрузки в браузере.
Поскольку в наши дни продолжительность концентрации внимания людей становится все короче, медленная загрузка веб-страниц, вероятно, приведет к высоким показателям отказов и потере возможностей для взаимодействия и конверсий.
👉 Вот почему владельцам сайтов следует работать над увеличением скорости загрузки страниц.
Один из лучших способов увеличить скорость загрузки страниц — использовать кеширование браузера.
Как мы уже говорили ранее во введении, кеширование браузера — это процесс хранения веб-страниц в браузере, который помогает уменьшить общие запросы к серверу. Это предотвращает перегрузку вашего сервера и ускоряет загрузку страниц.
Теперь, когда у вас есть представление о том, как использование кеша браузера повышает скорость загрузки веб-сайта, давайте узнаем, как реализовать кеширование браузера на веб-сайте WordPress.
Как использовать кеширование браузера в WordPress?
Существует два разных способа использования кэша браузера. Вы можете сделать это с помощью плагина или вручную отредактировав файлы конфигурации.
Рекомендуем ознакомиться со всеми способами, перечисленными ниже, и воспользоваться тем, который наиболее удобен для вас.
⚠️ ВАЖНЫЙ: Вы можете начать с удаления плагинов которые вам не нужны на вашем веб-сайте WordPress. Плагины добавляют дополнительный код и функциональность на ваш сайт. Такие дополнительные коды могут замедлить работу вашего сайта, особенно если плагины плохо закодированы или конфликтуют друг с другом.
Также сделайте резервную копию всего вашего сайта. 💾
Некоторые шаги в этом руководстве включают в себя переход на серверную часть вашего веб-сайта, доступ к важным файлам конфигурации и вставку фрагментов кода.
Другие шаги включают установку новых плагинов и добавление фрагментов кода в ваши файлы конфигурации. Все это рискованное дело. Одна ошибка может привести к сбою вашего сайта. Резервная копия станет вашей подстраховкой на случай стихийного бедствия. Поэтому сделайте резервную копию, прежде чем переходить к следующему шагу.
- Установите и активируйте плагин кеширования.
- Используйте файлы конфигурации для добавления фрагментов кода вручную
1. Установите и активируйте плагин кеширования 🔌
Использование плагина кеширования — это самый простой способ использовать кеширование браузера. Все, что вам нужно сделать, это установить плагин и правильно его настроить.
На выбор предлагается несколько плагинов кеширования. Некоторые из самых популярных из них — WP Rocket, W3 Total Cache, WP Super Cache, WP Fastest Cache и Comet Cache.
Большинство этих плагинов имеют бесплатную версию, которая позволяет использовать кеширование браузера.
У нас есть руководства по плагинам WP Super Cache и W3 Total Cache. Будьте уверены, чтобы проверить их.
2. Используйте файлы конфигурации для добавления фрагментов кода вручную 🧑💻
Чтобы вручную использовать кеширование браузера, вам необходимо выполнить следующие два шага: определить свой веб-сервер (Apache или Nginx) и добавить заголовки управления кешем или заголовки срока действия.
Определите свой веб-сервер
Вы можете быстро поговорить с вашим хостинг-провайдером и спросить его, используете ли вы Apache или Nginx, или выяснить это самостоятельно, выполнив следующие шаги.
- Откройте свой сайт в новой вкладке, щелкните правой кнопкой мыши в любом месте страницы и выберите значок Осмотреть вариант
- На панели «Проверка» перейдите к Сеть → Все → Имя
- Выберите любой из элементов в разделе «Имя», а затем перейдите к Заголовок вариант
- Прокрутите вниз, пока не найдете название вашего сервера
Добавьте заголовки управления кэшем или заголовки срока действия.
«Заголовки управления кэшем» и «заголовки срока действия» — это директивы, используемые для указания браузерам, как долго хранить и использовать кэшированный контент.
И заголовки управления кэшем, и заголовки expires служат одной и той же цели, поэтому вам не нужно добавлять оба заголовка на ваш хостинг-сервер.
В этом разделе мы рассмотрели, как добавить и то, и другое, но обязательно добавить только один на вашем сервере. Известно, что добавление обоих заголовков может вызвать конфликты на веб-сайте WordPress.
Заголовки управления кэшем более универсальны и современны, предлагая детальный контроль над кэшированием, а заголовки expires предоставляют базовый способ указать время истечения срока действия кэша. Тем не менее, вы можете добавить любой заголовок, который вам удобен.
Nginx-сервер
Пользователям Nginx необходимо войти на свой хостинг-сервер, открыть Файл конфигурациии вставьте следующий фрагмент кода, чтобы добавить заголовки управления кэшем:
location ~* \.(js|css|png|jpg|jpeg|gif|svg|ico)$ { истекает 7д; add_header Cache-Control “публичный, без преобразования”; }
При этом срок действия для указанных типов файлов устанавливается равным семи дням. Вы можете изменить количество дней, а также добавить или удалить типы файлов из фрагмента кода.
в тот же серверный блокскопируйте и вставьте следующее, чтобы добавить заголовки с истекающим сроком действия:
location ~* \.(jpg|jpeg|gif|png|svg)$ { истекает 365d; } location ~* \.(pdf|css|html|js|swf)$ { истекает 3d; }
Как видите, этот фрагмент кода устанавливает сроки действия для разных типов файлов.
Не стесняйтесь настраивать код в соответствии со своими потребностями.
💡 Примечание: Если вы не знаете, как получить доступ к файлу конфигурации Nginx, найдите справочный документ на своем хостинг-сервере или обратитесь за помощью в службу поддержки хостинга.
сервер апач
Пользователи Apache должны войти в свою учетную запись хостинга, получить доступ к файл .htaccess, и добавьте следующий фрагмент кода, чтобы добавить заголовки управления кэшем.
⌛ Важный Обязательно добавьте его перед предложением «#BEGIN WordPress» или после предложения «#END WordPress».
Код устанавливает срок действия кэша равным 172800 секундам или двум дням.
Добавить заголовки с истекающим сроком действия на ваш сервер Apache вставьте следующий фрагмент кода в файл .htaccess:
## КЭШИРОВАНИЕ ЗАГОЛОВКА EXPIRES ##
Вероятно, вы можете сказать, что код определяет периоды кэширования в зависимости от типов файлов.
Не стесняйтесь изменять оба кода так, как вам удобно.
Вот и все, ребята. Вот как вы можете использовать кеширование браузера в WordPress.
Вы все еще видите предупреждение об использовании кэша браузера?
Если инструмент скорости сайта по-прежнему показывает предупреждение об использовании кэша браузера, то, скорее всего, это связано с Google Analytics (GA).
Вы можете проверить, является ли GA настоящим виновником, запустив свой сайт на Google PageSpeed Insight. Разверните все результаты аудита и найдите Скрипты Google Analytics. Если виноват GA, то Page Insight Tool предложит вам «использовать кеширование браузера для следующего кешируемого ресурса».
Чтобы использовать кеширование браузера для GA, вам необходимо использовать сторонний плагин под названием Полный пакет оптимизации аналитики (CAOS).
Но прежде чем начать установку плагина на свой сайт WordPress, знайте, что этот метод не поддерживается Google и что плагин CAOS несовместим со многими плагинами Google Analytics.
Вывод 🧐
Использование кеширования браузера может значительно повысить скорость вашего WordPress, но вы можете сделать гораздо больше, чтобы ускорить свой сайт.
Например, вы можете ознакомиться с нашими руководствами о том, как улучшить производительность WordPress, а затем как увеличить скорость WordPress конкретно на мобильных устройствах.
Если у вас есть какие-либо вопросы по использованию кэширования браузера WordPress, сообщите нам об этом в разделе комментариев ниже.
Бесплатное руководство
4 основных шага для ускорения
Ваш сайт WordPress
Следуйте простым шагам из нашей мини-серии из 4 частей.
и сократите время загрузки на 50-80%. 🚀
