Доброе время суток, сейчас я расскажу как ускорить сайт или блог до 99/100, как для мобильника так и для компьютера, с помощью всего двух плагинов в связке. Конечно можно было и одним это всё сделать, но у меня почему то это не получилось. Мне кажется из-за моего сервера, он nginx.
Вы можете с начало попробовать один плагин и если всё пойдёт нормально то второй вам нет необходимости ставить. Ну а мне пришлось использовать их в связки, только так я добился таких результатов.
Итак, как ускорить сайт, поехали
Я долго не мог убрать из шапки все css и JavaScript. В поисках решения я наткнулся на плагин Autoptimize, он помог во многом, но не решил всех моих проблем. Этот плагин оптимизирует коды css и JavaScript, тоесть сжимает и перемещает все стили в один файл.
Но он не умеет перемещать их в подвал сайта, как того требует гугл для ускорения сайта. После скорость возросла до 77/100 для мобильных устройств и 90/100 для десктопов. Довольно не плохо по сравнению с тем что было до этого 50/100 и 64/100. И я продолжил поиск ещё вариантов как ускорить сайт.
Как настроить плагин Autoptimize
Сложного в настройках там нет главное всё поставить правильно. Мои настройки плагина для моего сервера такие, думаю и ваши будут точно такие же как и мои, нужно поставить всего три галочки:
- Оптимизировать код HTML? — Ставим галку. Думаю ясно за чем это.
- Оптимизировать код JavaScript? — Ставим галку. Тут думаю всё понятно.
- Оптимизировать код CSS? — Ставим тоже галку. Тоже всё понятно.
Вот как на скриншоте.
Но это ещё не все настройки этого плагина. Далее жмём кнопку Show advanced settings с права и переходим в расширенные настройки. Там у вас должно стаять шесть галок:
- Оптимизировать код HTML? — Галка уже стоит.
- Оптимизировать код JavaScript? — Так-же галка стоит.
- Force JavaScript in <head>? — Нужно поставить галочку.
- Оптимизировать код CSS? — Галка стоит.
- Inline all CSS? — Ставим галку.
- Save aggregated script/css as static files? — Нужно поставить галочку если не стоит.
Больше этот плагин не нуждается в настройках. Как я писал выше он ускорил загрузку сайта довольно не плохо, но всё равно не так как бы хотелось. И я начал искать решения проблемы как ускорить сайт. А проблема заключалась в том, что данный плагин оптимизировал все коды но не убирал их из верхней части страницы.
И я нашёл решение и этой проблемы, добавив довольно не плохой плагин. Между прочим он заменил сразу несколько плагинов стоящих у меня на блоге. Теперь уже не стоящих.
И так это плагин WP Optimize By xTraffic.
Данный плагин сам по сути оптимизирует только: картинки (вот как раз эта его опция мне заменила отдельно стоящий плагин для оптимизации изображений), делает красивую автоматическую перелинковку постов (что полезно для внутренней оптимизации сайта), трафик (честно я с этим ещё не разбирался, так как мне нужно было сначала оптимизировать загрузку сайта) и функция вставки любого кода в heder или futer сайта. Так же после и перед статьёй.
Но после установки он предложит вам установить дополнительную опцию WP Optimize Speed By xTraffic. Эту самую опцию мы и будем рассматривать. Как ускорить сайт с помощью плагина WP Optimize Speed By xTraffic.
Настройка WP Optimize Speed By xTraffic
Первая вкладка Optimize Cache. Это настройки кеширования. То есть заменяет отдельный плагин кеширования сайта. Отмечаем галкой и начинаем настраивать:
- Enable Cache Front Page ( Recommended ) — Ставим галку.
- Enable Cache Feed (RSS/Atom) Page ( Recommended ) — Галка.
- Enable Browser Cache( Recommended ) — Галка.
- Enable Database Cache ( Recommended ) — Галка.
- Use File (Default) — Галка стоит по умолчанию.
- Enable Object Cache ( Recommended ) — Галка.
- Use File (Default) — Так-же галка по умолчанию.
- Enable Cache SSL (https) Requests — Тут я не ставил галок, не пользуюсь этими протоколами.
- Enable Cache For Mobile Device — Галка, но читайте предупреждение ниже опции.
- Enable Prebuild Cache ( Recommended ) — Галка.
Далее всё оставляем так как есть. Всё это мы настроили кеширование сайта. Дальше идём во вкладку Optimize Javascript. Данная опция оптимизирует Javascript, по сути тоже что и плагин Autoptimize. Как я уже упомянул выше, что эта опция у меня не заработала сама по себе без Autoptimize, но вы можете попробовать её отключив предварительно Autoptimize.
Если же ваш блог будет отображаться коряво тогда советую использовать эту опцию в связке с Autoptimize, и так же следующую опцию Optimize CSS (Style).
И так что нам следует отметить галочками в Optimize Javascript:
- Enable Optimize Javascript — Включаем саму опцию, галка.
- Enable Move All Javascripts To Bottom — Ставим только тут галку и больше не где. Тем самым мы переносим скрипты в подвал из заголовака.
Дальше идём во вкладку Optimize CSS (Style) и отмечаем там:
Enable Optimize CSS — Включаем саму опцию.
Enable Asynchronous CSS Loading — Включаем асинхронную загрузка стилей.
Всё больше не чего тут трогать не нужно. Не забываем сохранять опции. В остальных вкладках я не трогал не чего, так как оптимизация хтмл включена в Autoptimize.
Как ускорить загрузку сайта заключение
Вот и всё чем я хотел с вами сегодня поделиться. Ещё раз повторюсь, если у вас хостинг на апаче то возможно у вас будет работать корректно и один WP Optimize Speed By xTraffic плагин, если же сайт будет отображаться коряво, используйте мои рекомендации.
И в доказательство моих слов представлю пару скриншотов:
Остался правда один пункт до сто процентного результата (используйте кеш браузера), но это щётчики. Если удалить всю метрику с сайта будет сто процентный результат.
Теперь вы знаете как ускорить загрузку сайта с помощью двух, а может даже и одного плагина для вордпрес.