Как ускорить сайт на WordPress

Как ускорить сайт на WordPressМедленная загрузка страниц — это большая проблема для любого сайта. Из-за этой причины сайты редко получают большую посещаемость, имеют низкую конверсию и частенько возникают проблемы с продвижением в поисковиках.

Однако если ваш сайт установлен на WP, то эта статья будет очень полезна для вас. Я раскрою все секреты, как ускорить сайт на WordPress за 10 шагов. Но прежде, чем приступать к ускорению сайта, давайте посмотрим, какая у нас скорость загрузки страниц?

Несколько отличных сервисов для проверки скорости сайта:

  1. Google Page Speed — простой инструмент от Гугл, который показывает все ошибки, мешающие загрузить сайт быстро. Он нам нужен, только для того, что бы узнать основные ошибки для исправлений.
  2. WebPageTest — навороченный инструмент, который наглядно показывает, как загружается каждый элемент вашего сайта и сколько времени на это затрачивается. А так же вы узнаете, как пользователи видят ваш сайт по секундам.

Многие проверяют скорость только главной страницы — это ошибка! Всего 10% посетителей увидят вашу главную страницу, все остальные люди будут читать статьи.

А в статьях часто подключаются дополнительные скрипты и код, который так же влияет на загрузку страницы. Поэтому проверяйте не только главную страницу, но и одну из последних статей.

Результат Google Page Speed:
Результат Google Page Speed
Результат WebPageTest:
Результат WebPageTestВ сервисе WebPageTest обязательно нажимайте на кнопку waterfall, что бы получить все данные в форме водопада. Это даст нам данные о TTFB (скорости передачи первого байта от хостинга) и путь рендеринга (когда пользователь получает отображенный сайт).

10 шагов по ускорению WordPress

Содержание статьи:

  1. Скорость хостинга — TTFB;
  2. Настройка WordPress;
  3. Настройка шаблона;
  4. Оптимизация базы данных;
  5. Удаление лишних и тяжелых плагинов;
  6. Настройка кэширования сайта;
  7. Сжимаем картинки + спрайты;
  8. Критический путь рендеринга;
  9. Ускорение загрузки шрифтов;
  10. Защита сайта от взломов.

1. Скорость хостинга — TTFB

Быстрый и качественный хостинг позволяет молниеносно передавать мегобайты данных о вашем сайте пользователям. Но как определить скорость и качество хостинга?

Переходим к анализа скорости сайта на WebPageTest. Стрелочкой я показал, за какой промежуток времени мой хостинг начинает передавать данные (первый байт информации или TTFB).проверка скорости хостингаВремя составило 0,303 секунды, что достаточно хороший результат. Быстрый хостинг всегда показывает результаты от 0,2 до 0,4 сек — идеальные показатели!

Плохой же хостинг может начать передачу данных через пол секунды и даже через секунду, что совершенно не допустимо! Поэтому рекомендую перенести сайт на sprinthost Sprinthost, где перенос делают бесплатно.

Ну а если вам не подходит данный хостинг, то всегда можно посмотреть список лучших хостингов 2016, где я добавил специальную графу «скорость», которая означает «скорость передачи первого байта» .

2. Настройка WordPress

WordPress по какой-то причине передает много лишней информации из-за чего сайт не реально тормозит, особенно при большой посещаемости. Наша цель правильно настроить WP и убрать всё лишнее.

Первые делом переходим в административную панель > «настройки» > «написание» и убираем 2 галочки.Настройка WordPress для ускорения 1Потом переходим во вкладку «обсуждение» и убираем галочки так же с двух пунктов. При желание в этой вкладке можно отменить пункт «показывать аватарку» это дает ускорение страниц на 10%, где есть аватарки.

Настройка WordPress для ускорения 2

А теперь установите плагин Disable All WordPress Updates, который позволяет не проверять сайт на наличие обновлений шаблонов, плагинов и самого WP. Почему плагин, а не вручную? Да потому что это очень удобно, захотел обновиться — деактивировал плагин, а потом включил его заново!

3. Настройка шаблона

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

Рекомендую изначально выбирать легкий и простой шаблон, который не перегружен скриптами и стилями. То есть при выборе шаблона, обязательно прогоняйте его с помощью Google Page Speed (должно быть более 80 баллов).


Лучшие шаблоны 2016 года — на данной странице я собрал 10 SEO оптимизированных шаблонов, которые включают в себя сжатие и ускорение. Результаты Page Speed можно увидеть под шаблоном.


И даже если у вас классный шаблон, который использует сжатые файлы, вы все равно можете улучшить его, убрав лишние запросы с помощью файлов header и functions. Найти их можно через «Внешний вид» > «редактирование шаблона» .

В header.php я переписывал готовые результаты запросов (к сожалению не помню изначальный вид запросов), но вот что у меня получилось:
ускорение через header.php
Получается так, что не нужно обрабатывать лишние запросы к серверу для того, что бы получить данные, а мы сразу выдаем готовые строчки для посетителя.

В functions.php дописываем несколько строк, что бы в коде сайта убрать лишние строчки. Кстати, таким образом мы так же улучшаем безопасность сайта! Вот скрин:
ускорение через functions.php
А с 7 строчки по 22 мы убираем смайлы, которые создают нагрузку 3-10% на сайт.Как вариант можно полазить по шаблону и заняться удалением лишних функций и оптимизацией нужных. Но я не разу этого не делал, поэтому не могу дать такой совет.

4. Оптимизация базы данных

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

Установим несколько крутых плагинов, которые сильно облегчат работу с базами данных:

1. WP-DBManager — он оптимизирует базу данных и вес базы становится в 10 раз меньше! Кроме этого он делает автоматические бекапы вашей базы и может удалять лишний мусор, который накапливается.

2. WPBase Cache — это плагин кэширования базы данных, который помогает ускорить работу запросов в 3 раза. То есть люди обращаться не к базе, а к готовому файлу, что не только ускоряет действия, но и снижает нагрузку на базу данных.

Вот как сильно упала нагрузка после установки двух плагинов:упала нагрузка после применения двух плагинов ускорения

5. Удаление тяжелых и лишних плагинов

Если вы используете более 10 плагинов, тогда вам обязательно стоит проверить, сколько создает нагрузки каждый из них. Для этого устанавливаем P3 plugin profile, который покажет сколько нагрузки приходится на каждый из плагинов.проверка плагинов для ускорения wordpress

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

Некоторые плагины могут подключать внешние стили и скрипты, что еще влияет на отображение сайта. К примеру DS Blog Map подключает скрипт в head «tw-sack.min.js» , который оттягивает загрузку сайта на 0,1 секунды.

6. Настройка кэширования WordPress

Изначально любой сайт весит около 600 — 3 000 КБ и имеет около 80-200 обращений к MySQL базе. Однако если мы включим кэширование определенных элементов, подключим gzip сжатие, объединим лишние css и скрипты, то нам удастся снизить вес страниц в 10 раз, а обращение к базе станет в 2-3 раза меньше.

Для того, что бы провести все настройки вручную без плагинов, потребуется много времени, поэтому я рекомендую решить все проблемы одним плагинов — W3 Total Cache. Очень мощный плагин с большим количеством настроек, но я пробегусь по основным из них.

1. Вкладка «Page Cache» , ставим галочки под этими пунктами:w3 настройка кэширование страниц
2. Вкладка minify (оптимизация js и css файлов), сначала сделайте резервное копирование, потом ставим галочки!w3 настройка сжатия файлов
3. Вкладка «Browser Cache» (включение кэширования браузером, gzip сжатие и другие плюшки). Вот где я расставил галочки:w3 настройка кеша
И последним делом переходите в General setting и ставите нужные галочки. После чего ваш сайт начнет очень быстро работать при повторном обращение к сайту.

7. Сжатие картинок и Спрайты

Сжатие картинок и СпрайтыКартинки в хорошем качестве весят 300-800 КБ их можно обрабатывать без потери качества и сократить их вес в 2-4 раза, то  есть вес станет 100-200 КБ. Это сильно поможет сайту быстрее загружаться т.к. нужно передавать меньшее количество информации.

Для того, что бы сокращать вес картинок, рекомендую скачать PhotoShop, где будем выбирать строчку «сохранить для Web». Данная функция работает лучше, чем любой другой онлайн сервис по сокращению веса!

Если у вас на сайте уже море не оптимизированных картинок, тогда можно установить плагин tinygrab, который сможет переработать png и jpeg в объеме до 500 картинок в месяц бесплатно. Либо найти альтернативный плагин.

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

Поэтому изобрели спрайты, которые объединяют все картинки в одну и с помощью style.css можно указать стиль определенного места для картинки и ее обозначение. Об этом можно написать отдельную статью, поэтому не буду детально описывать как и зачем это делается.

8. Критический путь рендеринга

Критический путь рендеринга — это минимальный набор обращений к сайту, который необходим для начала отрисовки страницы. То есть мы переделываем запросы так, что бы сайт максимально быстро отобразился для посетителя. Что для этого нужно?

Смотрим на график waterfall в WebPageTest!

Для быстрой отрисовки страницы необходимо, что бы css файлы загрузились в первую очередь. Обычно их загрузки могут мешать js файлы, которые иногда стоят выше и загружаются первыми. В теории мы уже объединили все css в один файл, а js файлы убрали в body с помощью w3 Total Cache плагина.

Вы можете не знать, но виджет Вконтакте подключенный с помощью скрипта в header.php создает запрос, который отодвигает загрузку страницы на целых 2 секунды! А что если у вас несколько социальных скриптов подключается первым css файлов? — Тогда загрузка будет ну очень долгой.

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

9. Ускорение загрузки шрифтов

Ускорение загрузки шрифтовЧастенько дизайнеры подключают внешние шрифты от Гугл под названием «Google Fonts». А для того, что бы они отобразились на сайте, браузер должен соединиться с сервером, тот с другим, где идет загрузка css-файла и только потом получаем этот файл обратно.

Потом наш сервер обрабатывает полученный css-файл, вынимает нужную часть и отдает ее посетителю сайта, что бы он увидел наш текст. А без этого страницы не покажется посетителю. Такой процесс заставляет тормозить загрузку сайта на 0,2-1 секунду в зависимости от сервера.

Зачем нам такой долгий путь, если мы можем загрузить шрифты себе на сервер и не запрашивать их у Гугла. Однако процесс загрузки шрифтов, оптимизации и внедрение на сайт не простой. Наверное скоро напишу отдельную статью, а пока читаем классный гайд — здесь.

10. Защита сайта от взломов

Последнее, что осталось сделать это защитить сайт от различных атак, которые могут сильно нагружать сервер и заставлять тормозить сайт. А владелец сайта может даже не подозревать, что сайт тормозит из-за постоянных атак. Защита сайта от взломовПлагин All In One WP Security позволит отвести практический любую угрозу от вашего сайта. Он может предотвращать спам в комментариях, поменять страницу входа, установить файрволл, защитить файлы от взлома, защитить базу данных и поменять пароли и доступы к самым нужным файлам.

Ну а если вас заинтересовала тема полной защиты сайта, тогда рекомендую прочитать — Как защитить WordPress в 2016 году.


Надеюсь, что данная статья будет полезна не только новичкам, но и профессионалам, которые решили значительно ускорить свой сайт. А какие результаты вышли у меня? Изначально сайт загружался за 12 секунд, мне удалось это время сократить до 3-ех секунд (загрузка последующих страниц менее секунды).

(голосов: 3, в среднем: 3,67 из 5)

Как ускорить сайт на WordPress: 5 комментариев

  • Февраль 9, 2017 в 2:27 дп
    Ссылка

    Облачные сервизы очень дорогие для обычных блогеров.

    Сперва нужно ускорить сам сайт,снизив нагрузку и удалить все то лишнее которые грузит сайт и не имеет право жить

    Вот мой вердикт,ускоряйте внутри а потом уже проверите и можете ускорить из вне через облако!

    Ответ
  • Апрель 16, 2017 в 12:20 дп
    Ссылка

    Здравствуйте! Скажите пожалуйста, есть ди смысл устанавливать эти плагины
    1, WP-DBManager
    2. WPBase Cache
    Если уже установлен и настроен W3 Total Cache. Там же есть настройка по сжатию базы данных. Или же они помогут еще ускорить сайт?

    Ответ
  • Апрель 16, 2017 в 12:32 дп
    Ссылка

    И еще у меня установлен плагин wp-Optimize? он заменит их или там есть что лучшее?

    Ответ
  • Ноябрь 4, 2017 в 12:37 дп
    Ссылка

    Можно CDN подключить и решить большую часть проблем. Лично для своих сайтов использовал w.tools, т.к. они кешируют динамический контент. За счет этого страница не генерится постоянно CMSкой, а отдается из кеша уже подготовленной. В итоге и нагрузка на сервер минимальна, и сайт в разы быстрее. + У них охват по регионам РФ хороший.

    Ответ
  • Апрель 24, 2018 в 7:16 дп
    Ссылка

    а вы не сможете сделать ускорение сайта за оплату?

    Ответ

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *