Вы хотите удалить файлы (CSS и JS), которые блокируют загрузку страниц в WordPress? Если вы тестируете свой сайт в Google Insights PageSpeed, то, вероятно, увидите предложение по устранению скриптов, блокирующих загрузку страниц. В этом руководстве мы покажем вам, как исправить эти файлы, которые блокируют загрузку ваших страниц, чтобы улучшить ваш показатель Google PageSpeed.
Что блокирует загрузку страниц?
Каждый сайт WordPress имеет тему и плагины, которые добавляют файлы JavaScript и CSS в конце и до того, как страница отображается в браузере. Эти сценарии могут увеличить время загрузки страницы вашего сайта, и они также могут блокировать отображение страницы.
Браузеру пользователя необходимо будет загрузить скрипты и CSS перед загрузкой содержимого страницы. Это означает, что пользователям с более медленным подключением придется подождать еще несколько миллисекунд, чтобы просмотреть страницу.
Владельцы сайтов, пытающиеся достичь хороших показателей Google PageSpeed, должны будут решить эту проблему.
1 - Как исправить отображение страницы с помощью Autoptimize
Этот метод проще и рекомендуется для большинства пользователей.
Первое, что вам нужно сделать, это установить и активировать плагин " Autoptimize ». Для получения более подробной информации см. наше пошаговое руководство по установке плагина WordPress.
После активации плагина необходимо посетить Настройки> Автоматическая оптимизация Для настройки параметров плагина.
Вы можете начать с установки флажка «JavaScript и CSS», а затем нажать кнопку «Сохранить изменения».
Теперь вы можете проверить свой Веб-сайт с помощью инструмента PageSpeed. Если остались скрипты, блокирующие отрисовку страницы, то нужно вернуться на страницу настроек плагина и нажать кнопку «Показать дополнительные настройки» вверху.
Здесь вы можете разрешить плагину включать JS в строку и удалять сценарии, которые исключены по умолчанию, например, «seal.js» или «jquery.js».
Затем прокрутите вниз до опции CSS и позвольте плагину объединить все файлы CSS.
Нажмите кнопку «Сохранить изменения и очистить кэш», чтобы сохранить изменения и Очистить кэш плагин.
Как только вы закончите, идите и проверьте свой Веб-сайт снова с помощью инструмента PageSpeed.
Убедитесь, что вы тщательно протестировали свой сайт, чтобы убедиться, что все работает нормально после оптимизации ваших сценариев JavaScripts или файлов CSS.
2 - Исправлен рендеринг файлов с помощью W3 Total Cache.
Этот метод требует немного больше работы и рекомендуется тем, у кого уже есть W3 Total Cache. сайт.
Сначала вам нужно будет установить и активировать плагин W3 Total Cache. Если тебе нужна помощь, Посмотрите наш полный путеводитель W3 Total Cache.
Затем вам нужно посетить «Производительность> Общие настройки» и прокрутить вниз до раздела «минимизировать».
Прежде всего, вам нужно установить флажок «Включить», а затем выбрать «Вручную» для параметра режима минификации.
Нажмите на кнопку Сохранить все настройки Чтобы сохранить ваши настройки.
Затем вам нужно добавить скрипты и CSS, которые вы хотите сжать.
Вы можете получить URL-адреса всех сценариев и таблиц стилей, которые должны быть объединены в соответствии с Google PageSpeed Insights.
Под предложения, где говорится: Исключите делают блокирование JavaScript и CSS ", Нажмите" Показать, как решить ". Он покажет вам список скриптов и таблиц стилей.
Наведите указатель мыши на сценарий, и он покажет вам полный URL. Вы можете выбрать этот URL-адрес, а затем использовать CTRL + C на клавиатуре (Command + C на Mac), чтобы скопировать URL-адрес.
Теперь перейдите в админку WordPress и перейдите в " производительность > Minifier .
Сначала вам нужно добавить файлы JavaScript, которые вы хотите сжать. Прокрутите вниз до раздела JS, затем в разделе «Операции в зонах» типа embed выберите «не блокировать использование асинхронного режима» для раздела. .
Затем вы должны нажать на кнопку Add Script А затем начните добавлять URL-адреса сценариев, которые вы скопировали из инструмента Google PageSpeed.
Когда вы закончите, прокрутите вниз до раздела CSS и нажмите кнопку «Добавить таблицу стилей». Теперь начните добавлять URL-адреса таблиц стилей, которые вы скопировали с помощью инструмента Google PageSpeed.
Теперь нажмите на кнопку Сохранить настройки и очистить кеш Для сохранения ваших настроек.
Посетите инструмент Google PageSpeed и снова проверьте свой сайт.
Убедитесь, что вы также тщательно протестировали свой веб-сайт, чтобы убедиться, что все работает нормально.
Это все, что касается этого урока, я надеюсь, что он позволит вам улучшить производительность вашего WordPress блог.