Сышышь ты, выходи сюда,
поговорим !

Главная Новости

Семь актуальных решений по ускорению сайта на Wordpress

Опубликовано: 05.09.2018

видео Семь актуальных решений по ускорению сайта на Wordpress

Выводы из инструкции асессоров Яндекса

Давайте сегодня займемся весьма насущной проблемой — как ускорить работу wordpress , и желательно, чтобы это ускорение было не на уровне5-10%, а измерялось в количестве прибавленных нулей к исходному значению. Да, возможен и такой прирост – не у всех, конечно, потому что много зависит и от конкретных факторов. Например, ускорить работу одностраничного сайта гораздо проще, чем загрузку новостного портала с десятками тысяч страниц.


Как увеличить скорость загрузки сайта и улучшить доступность сайта

Но все-таки значительное ускорение работы wordpress сайта – это реальность, и эту реальность мы сейчас будем изучать. Я предлагаю на ваш выбор несколько вариантов – их можно комбинировать, применять по одному или все сразу – все зависит от ваших требований к сайту, ваших знаний в php и html, ну и от желания разобраться во всей этой абракадабре. Поехали!


Урок 60 - Как проверить индексацию сайта, ускорение индексации в Яндекс

Проверяем скорость загрузки сайта

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

Работать с ним просто – введите адрес своего сайта и укажите количество проверок за один раз. Для блога SEOBID.NET, который вы сейчас читаете, скорость без проведения каких-либо работ по ускорению и оптимизации, составила 2,85 секунды. Что, в общем-то, совсем неплохо — ускорение загрузки сайта налицо.

Следующий сервис — tools.pingdom.com. Здесь проверка более расширенная, и вы можете посмотреть много параметров вашего сайта с тем, чтобы исправить ошибки и недоработки своими силами. Вот какой результат показал мой блог на этом сервисе:

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

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

Результат тоже неплохой, хотя для мобильных девайсов блог будет при загрузке притормаживать. Это потому, что я его не оптимизировал под мобильные устройства. Лучше всего для этого подойдет плагин WPtouch – статья о работе с ним называется Как сделать мобильную версию сайта wordpress на плагине WPtouch .

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

Способ первый – плагин Hyper Cache

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

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

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

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

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

Инструкция по настройке плагина Hyper Cache

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

define('WP_CACHE', true);

добавить в файл конфигурации wp-config.php. вставлять этот фрагмент кода необходимо после кода

define ('WPLANG', 'ru_RU');

или и в самое начало файла. Просто помните, что этот фрагмент кода должен находиться внутри тега <?php, например, можно сделать вот так:

/** Имя базы данных для WordPress */ define('WP_CACHE', true);

Очистка кэша плагином Hyper Cache

Настройка плагина, конечно, необходима, поэтому разберем ее подробнее. Вверху меню настроек вы увидите кнопку очистки кэша — «Удалить весь кэш». Этой кнопкой вы воспользуетесь в том случае, если вы что-то изменили в дизайне сайта или в его структуре, и хотите выводить пользователям обновленные страницы. Например, вы поменяли шаблон темы или добавили в него кнопки соцсетей .

Кнопка «Очистка архивов и домашней» предполагает внесение некоторых изменений в настройки плагина. Это: Кэшированные страницы будут действительны в течение (установите нужное время) часов. Включить или выключить сжатие. Когда домой обновляется, обновления даже Последнее сообщение При переходе на главную страницу число последних записей будет изменяться, если запись добавлена. Папки кэша по умолчанию или создание своей папки wp-content/cache/hyper-cache -> (ваша папка) для хранения кэша. Функция автоматической очистки кэша будет выполняться через установленное вами время. Это оптимизирует ваше дисковое пространство и на вашем wordpress ускорение загрузки будет вполне заметным даже визуально. Разрешение кеширования браузерами. При включении этой функции Hyper Cache отправляет запрос в браузер, позволяя ему не запрашивать страницу несколько раз. Если вы установите значение больше нуля, браузер будет хранить копии файлов указанное время. Если установить «0», то Hyper Cache будет сообщать браузеру, чтобы он постоянно отдавал копии файлов, пока страница находится в кэше. Пункт «Исключения» — здесь вы указываете, какие страницы не нужно кэшировать. Пункт «Мобильный». Если вы организовали мобильную версию блога, оптимизированную под мобильные устройства, то Hyper Cache сам способен определить устройство, с которого заходил пользователь, и сохранит страницу в кэше под другим именем. Этот прием позволяет выводить сохраненную копию одной и той же страницы, которая оптимизирована для вывода на разных устройствах. Пункт «Режим работы». Выбирайте подпункт «Кэш отдельно», если у вас на сайте есть контент, предназначенный для мобильных устройств. Пункт «Мобильная тема». Если у вас на сайте установлен плагин для организации мобильного блога, то в настройках выберите его название. В противном случает оставьте название вашего шаблона темы. Версии мобильных устройств пользователей (это могут быть android, iphone, iemobile, up.browser, up.link, mmp, symbian, smartphone, midp, wap, phone, ipod, xoom, blackberry и другие, которые вы укажете).

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

То есть, на 0,68 секунды мой блог стал загружаться быстрее (смотрите первый скриншот). А значит, плагин работает успешно, и в дополнение к нему я расскажу еще о нескольких способах, как сделать эффективное ускорение wordpress сайта.

Установка плагина Optimize DB – второй способ

Этот плагин делает ускорение загрузки сайтов на WordPress автоматически. Он оптимизирует всю вашу БД в фоновом режиме, и вам принимать участие в этом не нужно. Просто укажите в настройках, какие таблицы вы не хотите трогать (смотрите скриншот ниже).

Вам понадобится только кнопка «Go to optimizer» — нажимайте на нее один раз в месяц, и будет вам счастье! После каждого проведения оптимизации вашей базы данных плагин можно деактивировать, чтобы он не нагружал блог.

Результат использования этого плагина на моем блоге не заставил долго себя ждать – вот скриншот:

Вы видите, что блог ускорился еще на 0,03 секунды. Идем дальше и пробуем следующее решение по ускорению сайта.

Способ № 3 — установите плагин CSS Compress

Можно, конечно, сжать и css, и js файлы руками, то есть – использовать для этого специальные сервисы. Но разные шаблоны имеют разное количество вложений, например, один мой журнальный шаблон WordPress имеет еще 8 файлов css и 6 файлов js.

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

Помните об одном недостатке этого плагина – он может конфликтовать с какой-нибудь темой, и не факт, что ваша тема подойдет для сжатия. Поэтому перед включением плагина CSS Compress сделайте (на всякий случай) резервную копию шаблона темы. Но даже если вы забудете это сделать и ваш шаблон перекосится – не страшно. Просто удалите плагин, и все настройки шаблона восстановятся.

Четвертый способ — оптимизация style.css

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

Но вес и скорость загрузки файла css после оптимизации может возрасти на 10-90% — все зависит от того, кто этот шаблон писал. Вот так. После применения способа по оптимизации файла стилей я снова проверил свой блог сервисом webwait.com, и получил вот такой результат:

Скорость загрузки хоть и понемногу, но возрастает, поэтому экспериментируем дальше.

Уменьшение количества запросы в файле header

Редактирование файла header.php в шаблоне темы вашего блога способно намного ускорить загрузку веб-ресурса, так как уменьшится количество совершенно ненужных запросов к базе данных.

Наверное, не всем понятно, о чем я веду речь, поэтому объясню попроще: когда пользователь заходит на ваш сайт, то сразу начинает формироваться статическая html страница – определяется место для вывода контента, изображений, сайдбаров и прочих элементов. А происходит это таким образом – файл header.php отсылает запросы к БД сайта/блога, согласно которым и создается страница сайта.

БД в ответ на запрос (точнее, запросы) возвращает результат в файл header.php, поэтому на странице мы видим то, что видим — актуальное содержимое блога. Для редактирования файла header.php вам нужно его открыть. Сделать это проще всего в админпанели WordPress, в пункте меню «Внешний вид» — «Редактор». Рассмотрим наш файл header.php, точнее, то,. Что находится в нем в строчках 1-18:

Вот одна из строк:

<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />

Запрос ‘html_type’ обращен к нашей базе данных. Файл header.php запрашивает базу данных на предмет формирования страницы по определенному типу. Этот тип – отображение кодировки страниц сайта.

Дальше БД обрабатывает запрос и возвращает в блог совершенно другой код. Если вы зайдете на главную страницу вашего сайта и нажмете сочетание «горячих клавиш» Ctrl + U, то увидите исходный код страницы. И вместо того кода, который прописан в header.php, вы увидите совсем другой, обработанный ответ. У меня такой:

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

У вас, скорее всего, будет сформирован такой же код.

И таких запросов к вашей БД файл header.php отдает очень много. Выходит, что когда посетитель в браузере заходит на страницу вашего сайта, то файл шаблона header.php формирует и отправляет к БД очень много лишних, ненужных запросов к базе данных, которые непозволительно нагружают сервер и замедляют работу сайта.

А если у вас на сайте посещаемость 2-3 000 человек? Представляете, какую нагрузку испытывает ваш сервер? То есть, количество запросов нужно в любом случае уменьшать.

Для этого можно просто заменить некоторые запросы к БД на уже готовые результаты в коде html страницы. Изучите ваш header.php, и замените код запросов к БД на тот код, который вы увидите в исходном html коде страницы. Например:

<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>> <head profile="http://gmpg.org/xfn/11"> <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" /> <title><?php bloginfo('name'); ?> </title> <meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats --> <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" /> <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" /> <link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" /> <link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" /> <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" /> <link rel="shortcut icon" href="<?php echo get_option('home'); ?>/wp-content/themes/arthemia/images/favicon.ico" />

Если на главной странице своего блога вы нажмете сочетание Ctrl + U, то увидите совсем другие строчки:

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="stylesheet" href="http://isif-life.ru/wp-content/themes/isif-life/style.css" type="text/css" media="screen" /> <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://isif-life.ru/?feed=rss2" /> <link rel="alternate" type="text/xml" title="RSS .92" href="http://isif-life.ru/?feed=rss" /> <link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="http://isif-life.ru/?feed=atom" /> <link rel="pingback" href="http://isif-life.ru/xmlrpc.php" /> <link rel="shortcut icon" href="http://isif-life.ru/wp-content/themes/isif-life/images/favicon.ico" />

Совет простой: скопируйте эти строки код и вставьте их в файл header.php вместо тех, которые были до этого. Ведь вам не нужны лишние запросы?

Внимание! Запросы, которые вы видите между тэгами <titlе></titlе>, ни в коем случае не трогайте!

А вот этот фрагмент кода (если он у вас есть, конечно), можно удалить совсем:

<meta name="generator" content="WordPress <?php bloginfo ('version'); ?>" />

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

Перенос скриптов

Чтобы ускорение загрузки сайтов было эффективнее, вам нужно перенести коды скриптов js, css, text и других из файла header.php в файл footer.php. Объясняю, зачем это нужно сделать — когда пользователь заходит на ваш сайт, то страница грузится, и запросы отсылаются не только к базе данных, но и одновременно к странице подгружаются всевозможные скрипты, которые установлены в вашем шаблоне темы. Поэтому пользователь поневоле ждет, когда весь этот массив загрузится.

Посмотрите на свой файл header.php – там наверняка есть множество всяких подключенных скриптов. Это может быть и лайтбокс, и карусель, и формирование шорткодов – в общем, все, что угодно. Они заключаются в тэги <script></script> и находятся в файле header.php между тэгами <hеаd></hеаd>.

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

Теперь, когда пользователь будет заходить на ваш сайт, сначала будет загружаться html верстка и стили css (скелет и визуальная часть страницы), и только после них — остальные скрипты, поэтому страница будет появляться в браузере намного быстрее. Кстати, сервис developers.google.com тоже дает эти рекомендации. Не забудьте также добавить в файл footer.php следующий код, если его нет в вашем шаблоне темы:

<!--?php wp_footer(); ?-->
Плагин DB Cache Reloaded

Плагин способен в несколько раз уменьшить количество запросов к БД сайта. Настроек у плагина почти нет – просто установите его, активируйте и забудьте о том, что он есть вообще! Но перед тем как проверить его эффективность, зайдите на страницу настроек плагина и включите в его конфигурации пункт «Enable» — после сохранения настроек плагин уже начинает свою работу. После того, как я сделал все, о чем писал выше, я получил вот такой результат:

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

rss