Оптимизация сайта на WordPress: актуальные советы по увеличению скорости

В одной из предыдущих статей мы уже рассказывали о важности повышения скорости страниц сайта и инструментах для этого. Сегодня мы напомним об основных правилах "разгона" сайта, сделав акцент на сайтах, работающих на шестой редакции WordPress.

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

Часть мер по увеличению скорости работы сайта на WordPress универсальна, однако есть и специфичные конкретно этой платформе. Чтобы понять, как именно оптимизировать сайт на WordPress, давайте сначала разберемся, какие факторы оказывают влияние на скорость их работы.

Почему сайт на WordPress могут работать медленно

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

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

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

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

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

Инструменты для проверки скорости

Хотя согласно ряду данных, оптимальное время для загрузки страниц сайтов составляет в среднем 3-4 секунды для мобильных версий и до 2 секунд для десктопных, прогресс не стоит на месте и сегодня правильно настроенные сайты могут загружаться почти мгновенно.

Однако, чтобы рассчитать оптимальное соотношение скорости и функциональности необходимо использовать специальные инструменты. Мы уже писали подробно о PageSpeed Insights, GTMetrix, WebPageTest, Pingdom и Load Impact, поэтому скажем сейчас несколько слов о двух относительно новых сервисах, не вошедших в предыдущую подборку.

• Uptrends.com. С помощью этого сервиса можно протестировать как сайт работает в самых разных условиях. Для теста можно выбрать не только мобильную или десктопную версии, но и задать расширение экрана и даже выбрать конкретную модель устройства. Кроме того можно задать пропускные полосы интернет-трафика, выбрать браузер и координаты места, из которого вы пытаетесь зайти на сайт. Результаты тестирования скорости выводятся в виде графиков и таблиц; аналогично Gtmetrix, сервис приводит оценки PageSpeed Insights.
• PR-CY. Это русскоязычный сервис для анализа сайта, имеющий как бесплатную, так и премиум версии. В первой, помимо измерения скорости, можно проверить как сайт индексируется поисковиками, узнать, не находится ли он в теневом бане, посмотреть основные CEO-метрики и получить советы по юзабилити. Платная версия позволяет сравнивать между собой до 60 адресов и проверять каждую внутреннюю страницу сайта.

Что нужно сделать для оптимизации сайта на WordPress

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

Ищем оптимального хостинг-провайдера

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

В общем случае потребности WordPress в техническом плане не так уж велики, но при выборе хостинга для созданных на ней сайтов нужно учесть множество факторов. Мы постарались рассмотреть все основные, чтобы помочь вам сделать осознанный выбор. Из всех типов хостингов (Shared, VPS/VDS, Virtual Machine) для проектов на WordPress подойдет любой, главное чтобы хостинг отвечал масштабам и особенностям вашего персонального запроса.

Команда инженеров Максиплейс готова сопровождать вас на всех этапах миграции в наше облако: от планирования переезда до развертывания инфраструктуры на хостинге любого типа, который мы можем предоставить, будь то Shared или VPS/VDS и дальнейшей оптимизации и администрирования ваших сервисов.

Приводим в порядок плагины и шаблоны WordPress

Наведение порядка состоит из двух пунктов: обновлять все нужное и избавиться от всего лишнего. Если в случае с некоторыми приложениями или сервисами, которые вы используете в повседневной жизни, обновления не так критичны, то в случае с CMS сайта тянуть не стоит. Все компоненты WordPress и вовсе следует обновлять как можно скорее хотя бы из соображений безопасности, т.к. самая популярная CMS в мире находится под пристальным вниманием злоумышленников, а обновления затыкают дыры, которые были обнаружены хакерами в предыдущих версиях. Это касается и темы, которую вы используете, и плагинов. Своевременное обновление всего «обвеса», который вы используете на сайте, гарантирует его совместимость с другими компонентами WordPress, а следовательно, максимальную рабочую производительность. Также следует использовать только свежую версию PHP, чтобы сайт работал быстрее, а WordPress мог обновляться в автоматическом режиме.

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

Настраиваем кэширование

Когда все лишние плагины удалены, необходимо настроить кэширование, чтобы информация о страницах и файлах сохранялась в браузерах посетителей и подгружалась при повторном обращении оттуда, а не запрашивалась с вашего сервера. Это сэкономит вам ряд сетевых ресурсов и позволит сайту работать сайту гораздо быстрее. Однако не следует забывать, что страницы, загружаемые из кэша, могут не отображать сделанные вам обновления. Если на ваш сайт транслируются ленты соцсетей или, например, постоянно изменяются цены на товары, следует протестировать, как кэширование сказывается на динамических элементах. Преимущество WordPress перед многими другими CMS состоит в том, что настраивать кэширование вручную необязательно — для этого существует ряд некоммерческих плагинов, например Total Cache и Super Cache, благодаря которым кэширование запускается в несколько кликов.

Оптимизируем медиа-файлы

На скорость загрузки страниц сайта сильно влияет их вес. Одними из самых тяжелых элементов традиционно считаются медиа-файлы (изображения, видео, аудио и т.д.). Поэтому мы советуем оптимизировать эти файлы, стандартизируя их по весу, выбирая оптимальные форматы и удаляя лишние мета-данные. Для большинства CMS это можно делать либо вручную, либо используя внешние сервисы, например TinyPNG, однако WordPress может похвастаться плагинами для оптимизации медиа. Самые популярные из их — Smush и Compress JPEG & PNG Images. С бесплатной версией Smush можно сжимать файлы в автоматическом режиме в процессе загрузки в админку, очищать EXIF-данные фото, конвертировать изображения в WebP-формат и т.д. Кроме того плагин позволяет загружать изображения на страницах не одновременно, а по мере скроллинга посетителем, что также повышает скорость загрузки. Плагин оптимизации изображений WordPress Compress JPEG & PNG Images позволяет бесплатно сжимать до 500 PNG и JPG файлов в месяц.

Помимо оптимизации актуальных меди-файлов необходимо периодически удалять ненужные. За годы использования сайта на хостинге могут начать копиться тысячи неиспользуемых изображений или роликов, которые съедают ресурсы и вносят беспорядок. Убрать их в WordPress можно с помощью плагина Media Cleaner, который сканирует сайт и предлагает к удалению списки медиа-файлов, которые не отображаются ни на одной из страниц.

Чистим код, избавляемся от лишних скриптов

Следующий шаг — облегчить код сайта, чтобы ускорить его компиляцию. Существует ряд сервисов для сокращения HTML-кода, а такой бесплатный CEO-инструмент, как Varvy SEO может помочь разобраться в том, как работает ваш JavaScript. Однако WordPress имеет в своем арсенале плагины и на этот случай: установив WP Minify или Better WordPress Minify, вы сможете оптимизировать HTML-код, JavaScript и CSS сайта, не выходя из админки.

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

Рассмотрим подробнее, как можно оптимизировать CSS и JS.

• CSS. Необходимым условием оптимизации является уменьшение размера этих файлов. По дефолту CSS блокируют отрисовку сайта в браузере: не будет воспроизводить HTML-элементы, пока не прочитает весь CSS сайта. Следовательно, необходимо своевременно удалять все неиспользуемые стили, что особенно актуально, если вы подключили какой-нибудь CSS-фреймворк, содержащий больше CSS, чем вам реально нужно — помочь в этом может, например, сервис PurgeCSS. Также важно при загрузке страниц сайта загружать только критический CSS – тот, который необходим для стилизации только того участка экрана, который находится в поле зрения во время загрузки.
• JavaScript. Необходимо сокращать до минимума размеры JavaScript-файлов, поскольку у браузеров зачастую уходит много времени на их обработку после загрузки. Размер JS серьезно влияет на скорость их выполнения, что может влиять на работу пользователей с сайтом: нередки ситуации, когда страница уже загрузилась, но взаимодействие с ней «тормозит» из-за того, что JS-код еще обрабатывается. По этой причине важно разделять JavaScript сайта на фрагменты, которые будут загружаться только на тех страницах, где это необходимо, что можно сделать с помощью инструмента Webpack. Также важно помнить, что HTML веб-страниц отрисовывается в браузере сверху вниз и, если на пути отрисовки попадется JS-код, то она будет остановлена до его прочтения. Следовательно JavaScript по возможности должен подключаться после всего HTML перед закрывающим тэгом «body». Альтернатива — использовать при подключении JS атрибут «defer», сообщающий браузеру, что обрабатывать этот код нужно только после полной отрисовки HTML.

Оптимизируем скорость установления SSL-соединения

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

Оптимизируем запросы к SQL-базам

Иногда на скорость загрузки сайта может влиять его база данных. Вопреки распространенному заблуждению вес таблиц здесь не при чем. Низкая скорость ответа сервера может быть обусловлена следующим. Во-первых, запрос к базе может быть слишком тяжел и тогда его лучше разбить на два более мелких. Во-вторых, нужно проверить все индексы базы — поиск и выполнение такого оператора как JOIN должно происходить по индексируемым ячейкам SQL. Сама база может быть оптимизирована с помощью скрипта MySQLTuner, который анализирует работу MySQL и выводит рекомендации по его оптимизации. Настроив объектное кэширование можно кэшировать ответы базы данных на частые запросы, обновляя кэш только при обновлении информации (актуально для карточек товаров в интернет-магазинах).

Используем сети доставки контента (CDN)

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

Оптимальное решение для WordPress — использовать официального WP-плагина сервиса Cloudflare. Речь идет об обратном прокси-сервере для сайта, который повышает безопасность и производительность веб-страниц.

Заключение

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

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