Всем привет! В сегодняшнем посте я поделюсь с вами 17 способами, которые позволят вам ускорить блог. Мы поговорим про плагины кэширования для WordPress, а именно про hyper cache и его настройку.
Здесь будут представлены только самые лучшие методы, благодаря которым вы сможете реально повысить скорость своего блога в разы.
Итак, все по порядку.
Содержание:
Содержание
Любые значения нужно фиксировать, чтобы потом можно было сравнить точку начальной скорости, а затем после всех изменений посмотреть какой скорость стала. Для этого я порекомендую несколько сервисов. Вовсе необязательно зацикливаться на каком-то одном. Лучше я дам вам побольше выбора. Начну с самого распространенного гугловского сервиса проверки скорости под названием Page Speed. Чтобы найти его в одноименном поисковике просто наберите такую фразу «google page speed test». Самый первый сайт и будет искомый. Вот ссылка на него — https://developers.google.com/speed/pagespeed/insights/
Вводим адрес нашего сайта и нажимаем «Анализировать» (Analyze)
Далее идет анализ вашего сайта, т.е его сканирование и потом вы получите следующий отчет:
61% из 100% по пользовательскому опыту, т.е по удобству не такой уж и удобный по версии гугла.
Обратите внимание, что первая вкладка это тест для мобильных устройств. Так как мой блог не имеет адаптивного дизайна, он и показывает соответствующую цифру.
Далее идет скорость загрузки на мобильных устройствах:
Здесь уже чуточку получше – индекс 63%.
Теперь переключимся и посмотрим, какую информацию предоставляет сервис для десктопных устройств (результат тестирования для компьютеров).
Здесь уже другая информация. Следуя ей мне есть куда работать над производительностью своего блога. Да и вы, раз читаете эту статью, тоже столкнулись с такой проблемой. В некоторых статьях можно увидеть про расширения для гугл хром.
Но на официальном сайте разработчиков четко и понятно сказано, что версия для браузеров является устаревший и они рекомендуют пользоваться только онлайн вариантом на их странице. Ну и ладно, нас это не затруднит. Следующий не менее полезный сервис для анализа скорости и производительности блога называется GTMetrix.com. Переходим по ссылке и сразу же вводим адрес своего сайта, чтобы увидеть рекомендации, что улучшать.
Нажимаем на кнопку «Go» (Начать) и смотрим на результаты.
Данное исследование показало, что у меня скорость загрузки уровня B, хороший, но не лучший. Средний размер страницы 868Кб, время загрузки – 4.68 секунд. Я считаю, что это плохой показатель, который нужно улучшить. Следующая метрика это Yslow, которая отражает информацию по заголовкам, запросам, кукам, редиректам, яваскриптам, Аякс данным, в общем все, что может в техническом плане «съедать» скорость говорит этот показатель. Он вообще никудышный – 72%.
Вот, что показано в отчете:
Здесь я детально могу посмотреть, что нужно улучшать, чтобы ускорить блог. Это помечено желтым и красным цветом и является очень важным приоритетом. Давайте расшифрую вкратце, что должно быть улучшено мною, чтобы достичь максимальной производительности блога.
Для картинок, что указаны выше не указаны расширения, т.е отсутствуют атрибуты width и height. Решение следующее: переходите по ссылкам и вручную указываете атрибуты длины и высоты картинок, тогда это сообщение у вас должно уйти.
Если говорить простым языком, то все что указано у меня это скрипты сторонних сервисов, а именно группа в Вк, которая при загрузке сайта замедляет его, а также это сторонний скрипт видео на странице (в сайдбаре), именно он является сквозным, что в целом отяжеляет блог, счетчик твиттера. Рекомендация может быть только одна – старайтесь использовать как можно меньше скриптов на своих ресурсах. Например, виджет группы я удалю, когда перейду на адаптивный вариант блога. Он у меня совсем уже на подходе.
Говоря простым языком это сокращение времени загрузки часто используемых файлов сайта в браузере ваших пользователей. Очень важный показатель для повторно возвращающихся посетителей. Указанные выше файлы имеют короткий срок службы. Для них нужно указать срок действия, по крайней мере достаточно будет недели.
Решение есть: необходимо установить следующий плагин — Leverage Browser Caching Ninja.
После его установки и активации у вас появится в админ панели блога его ссылка. Нажимаете на нее:
Все, что вам нужно будет сделать, это выбрать чекбокс Enable (Активировать) и нажать на Update (Обновить). На этом шаге все файлы должны будут закэшироваться и этот показатель должен быть в норме.
Здесь я вижу кучу файлов CSS, которые нужно оптимизировать и уменьшить. Совет здесь – используйте как можно меньше плагинов, поскольку каждый из них идет со своими стилями, а нужно использовать их как можно меньше, поскольку на подгрузку каждого затрачивается время.
Решение здесь следующее – установка и активация плагина GZip Ninja Speed Compression. С его помощью вы достигните максимальной компрессии всех ваших файлов и скриптов, в результате чего скорость станет значительно выше и показатели в поисковых рейтингах (Google в особенности) будут расти. С ним разбираться особо не нужно. Также устанавливаем и активируем, затем переходим в панель администратора вашего блога и нажимаем на одноименный раздел.
Интерфейс такой идентичный предыдущему, так как разработчик общий 🙂
Включаем и обновляем. Двигаемся дальше.
5. Уменьшите редиректы (Minimize Redirect)
Тут я притрагиваться не буду, даже сервис говорит, что если их можно убрать, то уберите. Они завязаны на статистику и метрику. В эти дебри я лезть не смогу. Потому пропускаю. Существенно на скорость не влияет.
Это самый важный пункт, поскольку от работы хостера зависит успех или неуспех нашего проекта. Чем быстрее работает сервер хостинга, чем меньше он находится в дауне (не отвечает), тем лучше для нас и для многих показателей. Если это возможно, то используйте VPS серверы (виртуальные), они, как правило дорогие, но очень быстродейственные. Если не устраивает по цене то могу предложить несколько вариантов. Начну с зарубежных:
Из русских рекомендую пользоваться:
Также читайте статью – 7 причин по которым необходимо сменить хостинг. Очень информативная и полезная. Двигаемся дальше.
На своем блоге я использую только его. Есть и другие его аналоги тут, как говорится, на вкус и цвет – WP Super Cache, W3 Totall Cache. Про каждый из них я напишу, а сейчас расскажу про тонкие настройки плагина кэширования WordPress Hyper Cache. После установки переходите Настройки и увидите там его ссылку.
Если вы загружаете его впервые на свой блог, то вам необходимо сделать небольшие изменения в конфигурационном файле – wp-config.php. Вам нужно будет добавить следующую строчку:
|
1
|
define(‘Wp_Cache’, true);
|
Ее нужно будет вставить после строчки —
|
1
|
define(‘WPLANG’, ”);
|
Также, возможно, вы увидите сообщение «Вы должны сохранить параметры, так как некоторые файлы должны быть обновлены». Это сообщение появится если вы внесли изменения или обновили плагин.
Следующее изображение как раз иллюстрирует это предупреждение:
Следующий снимок позволяет вам ознакомиться и прочитать краткое руководство по использованию, прежде чем начать пользоваться плагином кэширования страниц и сайта и производить настройки:
Далее пробежимся по вкладкам:
Первые три трогать не нужно, там ничего не отмечено и чекбоксы будут отключены. Единственное скажу, что во вкладке под мобильные устройства, нужно чтобы было вот так:
Не забывайте все сохранять.
Смысл этого плагина в том, чтобы закэшировать все динамические страницы вашего сайта и отдавать их пользователям. Поскольку WordPress постоянно обращается к базе данных, то время загрузки естественно увеличивается. Если пользователь хоть когда-то просмотрел вашу страницу, то при повторном заходе на вашу страницу, он получит ее из папки кэша. Причем если вы постоянно обновляете контент, то он автоматически будет появляться и на закэшированных страницах. Вот вся суть этого плагина. Не сложно разобраться, правда?:-)
Здесь нам на помощь придет еще один замечательный, простенький и полезный плагин под названием – WP Minify Fix
Его суть очень проста – обеспечить сжатие всех CSS и Javascript файлов, чтобы улучшить время загрузки страниц сайта.
Устанавливаем, активируем и заходим внутрь его.
Оставляем все галочки включенными и нажимаем на «Обновить настройки»
Теперь настало время поговорить про оптимизацию картинок на вашем сайте
Это очень важный момент, поскольку при добавлении нового поста, многие вебмастера попросту забивают болт на картинки, не уменьшают их, т.е она может весить даже – 1 мб и они все равно ее разместят. Так делать нельзя, вы сильно утяжеляете свой сайт. Перейдя по ссылке выше вы можете узнать как улучшить и уменьшить картинки на своем блоге самыми разнообразными способами, а в этой части статьи я покажу как этого элементарно достичь с помощью плагина под названием – EWWW Image Optimizer. Для этого установим его у себя.
После того, как добавите его к себе, переходите в Медиафайлы и увидите там новую вкладку под названием «Неоптимизированные»
Перейдя в нее вы обнаружите сколько файлов нужно оптимизировать. Я когда увидел количество, то просто о**уел, извините за французский – 2743 изображения!
Все это «добро» надо уменьшать как можно быстрее. Нажимаете на кнопку «Оптимизировать все изображения» и попадаете в следующее окно, где сможете просканировать и уменьшить все картинки, миниатюры в медиабиблиотеке.
Прогресс работы вы можете увидеть в этом же окне, времени уйдет прилично у меня, а что делать…
Ну вот, наконец-то оптимизация изображений закончилась успешно и теперь можно двигаться дальше в ускорении производительности блога.
Чтобы получить на этот вопрос достойный ответ, нам необходимо загрузить еще один плагин, который как раз таки и покажет нам, какой из дополнений WordPress «съедает» время загрузки нашего блога. Называется он – p3 plugin performance profiler. Его также качаем с официального репозитория Вордпресс или через стандартный способ в админке.
После активации зайдем в инструменты и нажмем на одноименную ссылку.
Все что нам нужно будет сделать, это нажать на кнопку «Start Scan» (Произвести сканирование). Тем самым плагин посмотрит и проанализирует, какой из них самый долгий и «тяжеловесный».
Далее присваиваем имя проекту и нажимаем на «Auto Scan» (Автосканирование) или же можем выбрать Ручное сканирование «Manual Scan»
Потом немного нужно подождать, пока программа просканирует все возможные плагины и их нагрузку на блог. Вы получите вот такую гистограмму:
Из нее я смогу сделать вывод, что больше всего мощей поедает плагин Crayon Syntax Highlighter, который отвечает за отображение кода на страницах и записях. Буду думать как его заменить на вывод через функции и код, что вполне реально.
Снизить нагрузку и увеличить производительность блога мы можем путем оптимизации базы данных. Можно конечно все делать вручную, очищать и упрощать таблицы и так далее, но ведь можно воспользоваться достаточно простым решением – установить к себе на блог плагин WP Clean Up Optimizer. С его помощью вы сможете легко почистить весь накопившийся «мусор» в базе данных, не прибегая при этом к phpMyAdmin.
Интерфейс самого плагин очень простой и в тоже время мощный. Были и другие популярные решения, например Wp Optimize и Optimize DB. Сложность у меня была с ними только в том, что они оптимизировали все таблицы, в результате чего у меня все слетало и блог переставал работать.
Приходилось в срочном порядке восстанавливать сайт из резервной копии, я уже замучался на тот момент. Я уже хотел было плюнуть и оставить базу как есть (она у меня занимает около 27 Мб), как мне на глаза попался этот инструмент — WP Clean Up Optimizer. В нем может разобраться любой. Давайте расскажу про него поподробнее. Начнем с того, что установим его у себя:
Многих отпугивает количество инсталлов – всего лишь 5000+, это не 1000000 как у других раскрученных плагинов. Я рискнул и, наверное, не ошибся, выбрав его. После активации он создает свою ссылку в админке:
Также она (ссылка) будет доступна, когда вы будете находиться на странице в режиме редактирования записи уже непосредственно в браузере. Будет выглядеть вот так:
Вернемся в консоль и посмотрим, что есть внутри этого чудо «монстра». Переходим в режим Dashboard плагина и вот что видим:
Т.е не заходя в саму базу данных phpMyAdmin плагин выдает нам следующую информацию:
Обо всех них рассказывать не буду, ибо там большинство функций будет работать, только если вы им заплатите.
В бесплатной версии есть все то, что нам необходимо для оптимизации и ускорения базы данных.
Находясь во вкладке Dashboard просто спустимся ниже и посмотрим на вкладку Data Optimizer.
Именно здесь мы получим информацию про все наши ревизии записей (черновики), комментарии, пингбеки и весь прочий mysql мусор, который оставляет после себя «отпечатки» в таблицах. Мы все это и будем с вами чистить. Для этого отметим галочкой все чекбоксы и нажмем на кнопку «Empty» (Опустошить)
Потом после очистки, мы, по идее не должны увидеть синих кнопок «Empty» и все должно быть пустым. Вот так:
У меня остался пункт «Удаление транзитных опций» он почему то не удалялся, ну и ладно. Основной мусор почистили.
А теперь очень важно!
Во вкладке DB Optimizer вы можете увидеть полный список страниц и особое внимание обратите на элементы таблиц, отмеченных красным цветом и выделенных звездочкой. Это те таблицы, которые трогать настоятельно НЕ РЕКОМЕНДУЕТСЯ, так как их изменение и оптимизация может привести к некорректной работе самого сайта. Именно это и получилось у меня когда я пользовался плагинами Wp Optimize и Optimize DB. Может у вас все будет по другому, не знаю. У меня была ошибка и куча нервов от сломанного сайта….
С остальными же таблицами можете работать и очищать с них весь «шлак».
продолжение:
В результате моя база почистилась на 2 мегабайта, что я считаю, все равно не плохо.
Скоро напишу статью про то, как почистить базу данных MySql и приведу обзор самых разных инструментов. Будьте в курсе и следите за обновлениями.
WordPress очень интересная система управления содержимым и когда вы устанавливаете новую тему на сайт, то неизбежно встретитесь с динамическими обращениями к базе данных, которые ответственны за вывод таблиц стилей, подключения JS скриптов. Вот вам типичный пример, который взят из темы моего блога:
А также ряд других строчек, которые обращаются не напрямую к файлу, а через php код, как бы создавая лишнее обращение и создавая нагрузку. Решение здесь может быть следующее: просто заменить их на статичные адреса или воспользоваться специальным плагином под названием – Remove Query Strings From Static Resources.
Он позволит вычистить все лишние обращения и ускорить работу сайта. Как вы уже успели заметить, то на сервисе GTMetrix.com есть специальная вкладка, которая отражает этот параметр.
Итак, давайте улучшим и этот показатель, ведь все складывается из мелочей и ничего не нужно упускать из виду.
Просто устанавливаете плагин к себе и он автоматически начинает работать. Это просто! Сам не ожидал 🙂
В этом блоке я затрону вопрос клиентского кэширования – когда браузер способен локально сохранять файлы (CSS, Javascripts, изображения и т.д.), чтобы не дать возможность к ним повторных обращений.
Тогда всякий раз когда пользователь будет загружать одну и ту же информацию с вашего сайта, обращений к базе данных не будет и все будет происходить локально без нагрузки на сервер.
Это осуществимо благодаря HTTP заголовкам. Значение этих заголовков как раз таки будет свидетельствовать о том, с какой даты и времени веб документ можно будет считать просроченным и когда нужно снова запрашивать информацию о нем у сервера или удостовериться в его актуальности.
Для этого нам следует поработать с файлом .htaccess. Открываем его и вставляем следующий код:
|
1
2
3
4
5
|
ExpiresActive On
ExpiresByType image/gif A2592000
ExpiresByType image/png A2592000
ExpiresByType image/jpg A2592000
ExpiresByType image/jpeg A2592000
|
В некоторых случаях вы можете также увидеть и вот такую запись:
|
1
2
3
4
|
#Expire Header
<FilesMatch "\.(ico|jpg|jpeg|png|gif|js|css|swf)$">
ExpiresDefault "access plus 2 hours"
</FilesMatch>
|
Число 259000 означает количество секунд равное одному месяцу. Через это количество будет снова запрос к серверу. Чтобы вы понимали.
Вставлять данный код в самое начало и сохраняете на своем сервере в корневой папке.
Рекомендую также ознакомиться вам со статьей – 9 полезных фишек и хаков в htaccess
Данный блок будет завершающим, поскольку информации итак слишком много оказалось. Получилась не то, чтобы статья, а целый мануал. В довесок приведу еще ряд полезных рекомендаций, которыми не стоит принебрегать при увеличение производительности блога на CMS WordPress:
Если на вашем блоге помимо вашей активной темы есть еще и другие, которые не используются, но присутствуют в списке, то избавляемся от них. Особенно, если это стандартные дефолтные шаблоны от Вордпресс. Для этого нужно перейти в панель хостинга или связаться с сайтом по ФТП и войти в папку с темами «Themes» и удалить не нужные.
Говоря про это, я имею ввиду то, что подвал сайта и боковая панель является сквозными блоками и если на вашем блоге 1000 страниц, то это тоже самое как загрузить одновременно эти 1000 страниц по отдельности скрипт с картами, а они, как мы знаем, тяжелые и увеличивают время загрузки сайта. Может вместо этого есть смысл отдельно страницу с контактами?
Сделать это не сложно. Зайдите в админку, кликните на Настройки – Обсуждение и снимите галочку с чекбокса по середине «Разрешить оповещения с других блогов (уведомления и обратные ссылки)»
Каждый произвольный виджет на вашем блоге обращается к базе данных и создает нагрузку, если лично вы администрируете и ведете блог, может, есть смысл заменить все просто кодом или функциями.
Здесь я имею ввиду обновление версии движка Вордпресс, а также плагинов. Это делается с целью обезопасить ваш блог, ибо разработчики постоянно отслеживают и находят уязвимости в разных частях кода. Так что, не игнорируйте этот момент.
Не стоит загружать и устанавливать тяжеловесные темы, с большим количеством скриптов. Да, они выглядят круто, профессионально, но они долго загружаются. Всегда помните, что ваш сайт не картина, которой пришли любоваться, а бизнес инструмент, помогающий вам делать продажи и зарабатывать деньги и взаймодействующий с пользователем.
Можете использовать чистые, минималистичные адаптивные шаблоны. У меня есть подборка из 67 штук. Все это бесплатно.
Если все-таки решились на покупку темы, то рекомендую использовать шаблоны от Studiopress или ZigzagPress, оба они импользуют фреймворк Genesis. Его очень хвалят даже гугловцы, так как очень производительный и не требует больших серверных мощностей. С ним все загружается быстро и это нравится и пользователям и поиску Google.
|
1
2
3
4
5
6
7
|
#disable hotlinking of images with forbidden or custom image option
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?wpbeginner.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?feeds2.feedburner.com/wpbeginner [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L]
|
Вместо wpbeginner.com подставьте адрес своего сайта и сохраните изменения.
А сейчас давайте посмотрим, как изменилась скорость загрузки моего блога. Чтобы было с чем сравнить. Переходим снова в наш любимый сервис GTMetrix и нажмем на ссылку Re-Test
Класс! Теперь блог стал загружаться гораздо быстрее! Есть к чему стремиться. Этот показатель я еще увеличу, когда на блоге запустится адаптивная версия Bootstrap. Сейчас ее верстаю. Кстати, решил сравнить свой блог по производительности с блогом Дмитрия (ktonanovenkogo.ru). Его сайт очень популярен в интернете и у него бешенная посещалка. Результаты ниже:
На этом все дорогие друзья. Никогда еще за все время развития сайта я не писал такие очень подробные статьи – 3200 слов (22000 знаков). Я думаю, что теперь ваши сайты будут загружаться быстрее и вы, и ваша целевая аудитория останетесь довольными. Не забывайте ставить лайки и делать репосты. Всем спасибо за внимание и увидимся в следующих выпусках блога Smarticle.ru. Пока!
Я подготовил для Вас обращение, с ним можете ознакомиться тут
Макс Метелев - автор, блоггер, актер местного театра, ведущий городских мероприятий. Делюсь только лучшим!
Всплывающая форма обратного звонка на сайте WordPress
Как проверить сайт на дубли страниц?
Как добавить Disqus комментарии на сайте WordPress?
11 важных правил первичной оптимизации сайтов
Nrelate — плагин внутренней перелинковки страниц сайта
Как сделать импорт CSV записей в WordPress?
24 плагина обязательных для установки на коммерческие сайты на 2016 год
Создаем красивую форму обратной связи самостоятельно
57 отличных примеров сайтов на WordPress
Как настроить рубрики wordpress с помощью Rich text tags?
Бизнес идея — сухая автомойка
18 способов где брать уникальный контент для сайта
101 полезный совет для начинающего блоггера
Как установить метрику на сайт MODx
Как правильно подключить шрифты в CSS на сайте?
Как ограничить доступ к админке wordpress?
Устанавливаем виджет яндекс пробки без информеров
Как добавить кнопку подписки на канал Youtube?
Как установить фон для сайта?
Как привлечь рекламодателей на сайт
Обучающий тренинг-центр База знаний для интернет предпринимателя. Здесь вы сможете получить полную, проверенную, а самое главное доступную информацию о Wordpress, SEO, научитесь востребованной профессии на рынке IT услуг. Все уроки бесплатные, мы не взымаем плату. Информация постоянно обновляется и пополняется свежими выпусками.
