Как ускорить загрузку wordpress
Как ускорить сайт на WordPress
Тема оптимизации WordPress сайтов с целью заставить их работать быстрее не нова.
Первое и самое главное здесь — включить кэш на стороне сервера. Также рекомендуется использовать CDN для кэширования при доставке контента. Разберем подробнее: что, где и как кэшировать.
Для примера установим чистый WordPress на сервере отечественного хостера. Время генерации одной страницы со старта без каких-либо плагинов достигает полсекунды. Полная загрузка страницы у пользователя из Европы занимает около 1 сек., в США (запад) — 2.2 сек., в Австралии — 2.8 сек. Цифры получены следуя этой инструкции и на основе данных загрузки сайта из разных уголков мира с помощью сервиса Webpagetest.
Как видим, не слишком быстро для пустого движка. А значит есть повод для кэширования.
Кэширование на сервере
Слабым местом многих сайтов являются тяжеловесные запросы к базе данных MySQL. В WordPress они зачастую генерируются установленными плагинами.
Прежние рекомендации ускорения базы данных с помощью кэша запросов нельзя назвать перспективным решением, ведь в последней версии MySQL кэширование напрочь убрали из-за проблем при масштабировании. Попробуйте установить бесплатный Query Monitor и выявить плагины, генерирующие ресурсоемкие запросы. По возможности выключите их или замените адекватными аналогами.
Если все же необходимость подключить кэш ответов MySQL осталась, для этого можно использовать опенсорсный инструмент проксирования запросов ProxySQL.
Идем дальше — кэширование в PHP. Во всех последних версиях начиная с 5.5 здесь по дефолту включено расширение OPcache. Таким образом, скомпилированный код автоматически сохраняется в памяти для максимально быстрого его исполнения.
Результатом работы упомянутых выше MySQL запросов и PHP скриптов является сгенирированный HTML код, который отдается пользователю в качестве веб-страницы. Если этот HTML временно (до внесения изменений в контент) сохранять на сервере и отдавать его пользователям без обращения к PHP и MySQL — время загрузки такой страницы будет наименьшим. По такому принципу работает большинство WordPress плагинов кэширования. Они сохраняют уже сгенерированную HTML страницу как файл и отдают ее за сотые доли секунды.
Среди кэш-плагинов по числу установок лидирует бесплатный WP Super Cache. После его установки, включаем кэширование и жмем «Обновить»:
Работающий плагин добавляет в конце HTML кода закэшированых страниц информацию о времени их создания:
Стоит упомянуть о возможности использовать вместо кэширующих плагинов кэш от Nginx. Принцип его работы такой же, как и у плагинов. Nginx генерирует временные файлы, в которых хранит результаты предыдущих запросов.
Чтобы не запутаться в многоуровневых кэшах, старайтесь избегать одновременного использования кэш-плагинов и кэширования в Nginx.
Подключение CDN для WordPress
Помимо исполняемых на сервере PHP скриптов и MySQL запросов, движок WordPress содержит и статические файлы: картинки, стили, шрифты, яваскрипты. Скорость загрузки таких файлов зависит от их размера и того, насколько географически далеко от них находится пользователь.
Касаемо размеров файлов, — за этим всегда нужно следить. Не стоит ждать от картинки в несколько мегабайт быстрой загрузки на мобильном интернете.
Для того, чтобы у пользователей из других стран и континентов ваши файлы грузились быстро, используйте CDN. Это cети доставки контента, которые хранят копии ваших файлов на кэширующих CDN-серверах в разных географических регионах. Запросив файл через CDN, пользователь максимально быстро получит его с ближайшего сервера.
Подключим CDN к своему сайту. Для этого зарегистрируемся на BunnyCDN и, указав лишь емейл, сразу получим на тест 1Тб бесплатного мирового трафика.
Затем в личном кабинете нужно создать Pull зону, выбрав для нее имя и указав адрес нашего сайта, откуда будут тянуться файлы для кэширования по всему миру:
Создав зону, в конце выбираем «Wordpress» и следуем короткой инструкции по включению плагина кэширования:
Результат
После включения плагина кэширования и подключения CDN скорость загрузки страницы сайта снизилась до полусекунды для Европы и почти до секунды для США и Австралии. Посетители, определенно, будут довольны, а просмотров станет больше.
Таким образом, в нашем примере чистый WordPress без картинок пользователи по всему миру стали загружать в среднем в 2 раза быстрее. Для сайтов, нафаршированных картинками, стилями и яваскриптами, выгода будет еще существеннее.
Разгоняем WordPress до скорости света
1 Тестируем текущую скорость
Чтобы узнать изменилось ли что-нибудь после нашей оптимизации, не помешает замерять для начала текущую скорость загрузки страниц блога, чтоб было с чем сравнивать. Есть несколько инструментов, которые помогут сделать это:
1.1 Pingdom
Pingdom проводит быстрое и наглядное тестирование скорости загрузки всех элементов на странице и представляет результаты в виде удобной диаграммы, где можно посмотреть, какие элементы сайта загружаются медленнее чем необходимо и прочие проблемные области. 
Бенчмарк одного довольно известного ресурса.
1.2 YSlow
YSlow– плагин для Firefox, который встраивается в, пожалуй лучший плагин для веб разработчика, Firebug. Он анализирует более 20 факторов, которые влияют на скорость работы сайта и оценивает общую производительность по 100 бальной системе, а каждый отдельный элемент оценкой от A до F.
1.3 Количество запросов и время их выполнения
2 Web Hosting
Это, конечно, не означает, что вы не сможете ускорить блог, работающий на виртуальном хостинге(Shared Hosting), однако стоит помнить – производительность тем выше, чем большие ресурсы мы имеем в своем распоряжении.
Не последнюю роль играет также и географическое положение сервера, потому всегда нужно примерно представлять свою целевую аудиторию. Например, если это русскоязычные пользователи – не стоит покупать американский хостинг и т.д.
3 Установка и настройка сервера
Удостоверьтесь, планируемая нагрузка соответствует мощности сервера и он сможет с ней справиться. В первую очередь это будет зависеть от объема оперативной памяти и процессора. Как правило, WordPress ставят на Apache, но много удачных решений существует и на базе других http серверов: nginx, lighttpd и т.д.
Не забудьте обновить до последней версии PHP и Apache.
3.1 Отключите неиспользуемые сервисы
3.2 MYSQL Query Cache
query_cache_type = 1
query_cache_limit = 2M
query_cache_size = 20M
Чтоб настройки вступили в силу придется перезапустить сервис MySQL сервис.
3.3 Кэш компилятора: XCache или Eaccelerator?
Кэш компилятора увеличивает производительность откомпилированных скриптов на сервере, кэшируя их – это поможет сократить время выполнения PHP скриптов. Стоит попробовать и то и другое решение, однако по результатам опытов увеличение производительности при использовании Xcache на 5% выше, чем с Eaccelerator.
3.4 Увеличьте максимальное число соединений на Apache
Не забудьте рестартить сервис Apache, чтоб применить настройки.
4 Оптимизация кода и графики
Итак, сервер заработал и теперь настало самое время поиграть с кодом WordPress.
4.1 Отключите хотлинки
4.2 Используйте внешний хостинг для хранения изображений
Хостинг изображений на внешних серверах поможет значительно снизить нагрузку на сервер. В примере ниже вы можете видеть снижение объема используемой оперативной памяти на одном из блогов после переноса изображений на сервис Amazon S3.
4.3 Сжимайте java-скрипт код
Сжатие javascript довольно простая задача. Поскольку он выполняется при каждом просмотре страницы, вы можете уменьшить размер Javascript, удалив все незаполненное пространство. Вот простой инструмент, который поможет сделать это за вас — JavaScript Compressor.
4.4 Javascript в начале страницы
Часто случается так, что сайт начинает загружаться медленно или вообще останавливается, т.к. другой ресурс, с которого вызывается javascript(на пример Digg badges, Tweetmeme и т.д.), не доступен или оффлайн. Чтобы избежать этого вынесите весь javascript код в конец страницы, а то что по каким-то причинам вынести не удалось – попробуйте заключить в iFrame.
4.5 Используйте кэш браузера
4.6 Сжимайте статические данные
4.7 Используйте CDN для статических файлов
Если хранить все изображения на одном и том же домене, то браузер будет ожидать их загрузки одного за другим. Допустим на странице их у вас есть 12 штук, если вы разделите их между тремя поддоменами, они будут загружаться одновременно из трех «разных» источников вместо того, чтоб загружаться браузером по очереди из одного.
Можете попробовать перенести все css & javascript файлы на files.yoursite.com, а изображения и временные файлы на static.yoursite.com. Или же просто использовать CDN(Content Delivery Network) – большая сеть серверов, расположенных по всему миру, которые позволят не только хранить ваши файлы на разных поддоменах, а значит загружать их параллельно, но и доставлять пользователю данные с самого близкого к нему сервера. Все это позволит загружать данные намного быстрее.
5 WordPress
В этой части статьи мы рассмотрим приемы для улучшения производительности, которые можно применить непосредственно к WordPress.
5.1 Обновитесь до последней версии
Обновления до более новых версий позволяют не только устранять обнаруженные уязвимости, но и улучшают производительность. Для примера в wordpress 2.8 была существенно оптимизирована работа с БД.
5.2 Отключите Post Revisions
DELETE a,b,c
FROM wp_posts a
LEFT JOIN wp_term_relationships b ON (a.ID = b.object_id)
LEFT JOIN wp_postmeta c ON (a.ID = c.post_id)
WHERE a.post_type = ‘revision’
5.3 Сократите количество запросов
meta http-equiv =»Content-Type» content =»text/html; charset=UTF-8″ />
Уже на два запроса меньше. Довольно просто, не правда ли?
6 WordPress Plugins
И на последок предлагаю вашему вниманию несколько плагинов, которые могут повысить производительность wordpress. Как только все, описанное выше, будет выполнено, эти плагины помогут добиться еще более высокой производительности.
WP Super Cache
Это, пожалуй, лучший плагин к WordPress. WP Super Cache создает статические html версии каждой страницы и загружает их каждый раз, обходясь тем самым без запросов к БД. Это значительно увеличивает скорость загрузки страниц и снижает нагрузку на сервер. Строго рекомендуется к установке.
PHP Speedy WP
Этот плагин решает другую проблему, обозначенную в этой статье – удаление незаполненного пространства в CSS & javascript. Однако есть некоторые проблемы совместимости этого плагина с WP Super Cache, кроме того он долгое время уже не обновлялся, потому используйте на свой страх и риск.
Optimize DB
Плагин позволяет оптимизировать таблицы MySQL без помощи PHPmyadmin.
Счастья тебе и твоему уютному бложеку, %username%.
Ускорение сайта WordPress в 2021 году
Пришло время для актуализации информации и полного обновления статьи с учетом полученного опыта, потому, размещаю новую версию, актуальную для 2021 года. По крайней мере, приведённые здесь способы до сих пор работают.
Ускорение сайта на WordPress — задача довольно сложная и нетривиальная, например, если требуются хорошие результаты для PageSpeed Insights. Причин для возникновения сложностей довольно много:
Довольно сложно настроить кэширование. Например, Drupal в этом плане дает гораздо больше возможностей, к тому же из коробки.
Отсутствие встроенных методов асинхронной и отложенной загрузки скриптов. Постоянно приходится выдумывать костыли.
Для расширения функционала может потребоваться немалое количество плагинов, которые также замедляют веб-приложение.
Встроенный функционал довольно велик, очень трудно обрезать лишнее, не порушив структуру системы управления содержимым, на Drupal, несмотря на большую универсальность, отключать лишние функции проще.
Еще куча всякой мелочёвки, которою рассмотрим в процессе. Итак, пора перейти к делу. В данной статье мы рассмотрим ускорение для ПК, а также оптимизацию WordPress для мобильной версии сайта. Кстати, рекомендую не концентрироваться только на PageSpeed Insights, лучше замерять с помощью GTmetrix или Pingdom Tools.
Нужна помощь? Не проблема, напишите мне на почту: admin@workinnet.ru
Начало ускорения
Оптимизация WordPress начинается с теста скорости. Тут все довольно просто, есть такие инструменты, как PageSpeed Insights от Google, также Pingdom Tools, GTmetrix. Рекомендую использовать все, они покажут, какие слабости есть у сайта. Ниже скриншоты тестов. Вроде все неплохо, за исключением гугловского инструмента. К сожалению, вы запросто можете оказаться в ситуации, что от вас требуют высоких результатов в данном тесте, не понимая даже, что он собой представляет. Конечно, можно улучшить сильнее, но тогда пострадает дизайн. В целом, в мобильной версии у меня от 60 до 64, в ПК от 87 до 93. Когда как. Но в основном проблема заключается в партнерках, счетчиках и частично с файлами js и css. В общем, многое исправить будет нелегко, да и не нужно.
Неоднократно наблюдал, что «зеленые» сайты грузятся визуально долго, а «желтые» прогружаются заметно быстрее. Так что относитесь к результатам инструмента с некоторой долей скептицизма.
И небольшое предостережение. Не старайтесь добиться самых высоких результатов. Иногда полезнее пожертвовать производительностью, но сделать красивый сайт и дать пользователям необходимое, чем размещать голую страницу без красивых шрифтов и с минимумом изображений. Делайте все в меру, не гонитесь за цифрами.
Кстати, специально для тех, кто решит протестировать мой сайт, публикую результаты теста без использования рекламы от Яндекс.
А на скриншоте ниже наглядно демонстрирую, что реклама творит со скоростью сайта. К сожалению, это так. Кстати, Adsense меньше замедляет сайт.
Так что, если у вас на сайте реклама, то скорость будет на порядок ниже. И ничего с этим поделать не сможете.
Без плагинов
В первую очередь стоит настроить все, что возможно, без плагинов, дальше все это придется залакировать кешированием и прочими веселыми элементами. Для начала определимся с выбором хостинга.
Хостинг
Раньше я держал сайт на Fozzy, но сейчас решил переехать на Beget, это самый шустрый хостинг из всех, что я пробовал. По крайней мере претензий к данному хостингу нет. Так что рекомендую.
К выбору хостинга стоит отнестись серьезно. Простые сайты размещал на Reg.ru, вполне хватало. Конечно, ходят легенды о том, какой хостинг плохой. Но на деле он такой же как все. Но есть несколько но:
При аналогичной мощности у других хостеров чуть дешевле.
Малое количество процессорной мощности, тот же Fozzy предлагает 120cp (процессорные минуты, учтите, это очень неинформативное понятие, но хостинги используют именно его) вместо 58. А цена даже чуть ниже.
Невозможно настроить исходящие письма без костылей в виде плагинов для WordPress. Впрочем, «коробочный» функционал у ВП не очень, так что плагины лучше всего ставить по умолчанию.
В общем, вот пара скриншотов для сравнения.
Честно говоря не впечатляет. Одни и те же сайты у меня шустрее работают на Макхост.
Есть еще один интересный хостинг: https://fozzy.com/. Fozzy интересен тем, что использует веб-сервер LiteSpeed. Соответственно, это отличное кеширование, шустрое реагирование на запросы. Данный хостинг способен обеспечить максимальную производительность на ресурсах с большим количеством повторных посещений. В общем, если рассчитываете, что к вам будут возвращаться люди, то он быстрее любой другой связки. Но для новых посетителей Apache+Nginx будет пошустрее. Из панелей есть cPanel, ISP и DirectAdmin. Все вполне удобны. Цена за месяц на тариф «5 быстрых сайтов» — 199 рублей, короче, самый дешевый вариант. Если решите, что вам данный хостинг подходит больше, то вот промокод на скидку: 0f42e170-1599-4410-8934-83f003aa61df
Кстати, когда-то сидел на McHost, но в итоге я с Макхоста переехал на Fozzy. Производительность чуток получше оказалась, а цена на 50 рублей ниже. К тому же панель DirectAdmin мне больше нравится, чем самописная панель на Макхост.
Ладно, с хостингом определились, на самом деле выбирайте любой наиболее удобный, где есть поддержка PHP версии 7.4 (а вскоре и 8.0, но пока что полноценная поддержка в WP не реализована), Apache+Nginx или LSAPI. Не обязательно выбирать то, что предложил я. По крайней мере, наиболее шустрый вариант для первоначальной загрузки — Apache + Nginx. А вот если есть постоянные посетители (причем много), то эффективней окажется LSAPI, ибо он значительно ужимает байты при повторной загрузке и лучше подходит для формирования статического кеша. В любом случае, чистый Apache проигрывает обоим вариантам.
Итак, добавляем следующее содержимое:
Версия PHP и обновление WP
Потому лучше обновить WP и плагины. Если есть серьезно устаревшие, которые давно не актуализировались, то заменить на другие. Но учтите, существуют плагины, которые не обновлялись по несколько лет, а с кодом у них все в порядке. Смотрите внимательнее. Кстати, актуальная версия WordPress работает стабильнее и шустрее, чем предыдущая ветка, потому рекомендую не откладывать переход. Если у вас версия 4 с копейками, то самое время задуматься о переходе на 5.8. Чем дольше ждете, тем сложнее будет обновиться.
Контент
Не все обращают внимание на данную сторону оптимизации, а она крайне важна. Контент имеет определенный вес. Изображения, разные файлы, видеозаписи, текст в конце концов. И если видео можно загрузить на Youtube и выдавать оттуда, а разные файлы не будут ничего весить до запроса пользователя к ним, то изображения вызывают большую проблему.
Сколько раз наблюдал несжатые картинки с весом более мегабайта. Когда таких накопится критическая масса, то страница может весить под 15 МБ. Итак, что рекомендуется делать:
Менять размер картинок на оптимальный. Например, 1024 X768 пикселей вместо 4K.
Использовать сжатые форматы. Например, JPEG. PNG весит значительно больше. Также повсеместно внедряется поддержка Webp, который гораздо лучше сжат, чем PNG, полноценная поддержка данного формата есть уже у большинства браузеров, к сожалению, пока что у многих устаревшие версии, а подключение Webp с помощью плагинов очень кривое. В общем, лучше пока не рыпаться и остановиться на JPEG.
Дополнительно сжимать, с помощью утилиты FileOptimizer на компьютере. Также есть плагины, позволяющие сделать это. Тот же Smuсsh. Но я предпочитаю сжимать сначала на компе. Но если на сайте куча неоптимизированных изображений, смело ставьте.
Использовать миниатюры и открывать полноразмерную картинку в лайтбоксе.
Так что, позаботьтесь, чтобы на страницах не было ничего «тяжеловесного», особенно изображений. И дополнительно рекомендую воспользоваться функциями ленивой загрузки ( Lazy Load ), кликайте по ссылке, там все подробно описано.
Сеть доставки контента. Фактически, весь статический контент размещается на сторонних серверах, а посетителю выдается из наиболее близкой к нему точки. Можно отправлять посредством CDN:
предварительно c генерированные html
Система проста: ваш контент дублируется на множество разных серверов и при запросе к сайту, все ресурсы выдаются пользователю с наиболее близкого по местонахождению. Значительно сокращает пинг, но удовольствие недешевое. Подойдет только крупным площадкам, способным окупать такие затраты (если в CDN вообще будет смысл), а также организациям, желающим плотно застолбить регионы. Если желает двигаться по Европе и США, то вам подойдёт бесплатный CDN от Fozzy или Cloudflare.
Ускорение сайта WordPress на уровне Back-end
Т еперь пришло время улучшить работу WP, для этого понадобятся минимальные знания, ибо я предоставлю готовые решения, способные значительно упростить жизнь. Начнем, конечно же, не с самого простого.
Выбор темы
Это ключевой момент. На самом деле движок WordPress довольно-таки шустрый. Его ругают за то, что из «коробки» ничего нет, но я считаю это правильным. Такой подход дает большую вариативность последующей кастомизации. Поставил плагин для SEO какой нужно, добавил функционал, который необходим именно для целевого проекта.
Но не только плагины грузят сайт. Частенько, основным фактором нагрузки становится тема. Стандартные темы WP практически не содержат в себе ничего лишнего, соответственно, не требуют колоссальных ресурсов для генерации страниц. Но ведь функционал данных тем может показаться недостаточным?
И тогда начинается поиск. Рекомендую следующее. По возможности не брать темы с большим количеством скриптов, где все элементы построены на AJAX. Да, они выглядят красиво, но чтобы обеспечить широкий функционал, могут быть подключены сотни разнообразных скриптов, которые будут с трудом грузиться. Да и подход к SEO при использовании AJAX несколько сложнее.
Чем чище тема, тем лучше. Обращайте внимание при выборе платных премиальных тем. Часто разработчики стараются удовлетворить максимально широкие потребности конечного потребителя, так что в них будет понапихано всего и побольше. Например, Avada, JupiterX. Там будут конструкторы тем, разнообразные функции для поддержки встроенных слайдеров, некоторые вообще не будут работать без тяжеловесных плагинов.
Лично предпочитаю брать темы из официального репозитория. Простые, без излишеств и слишком широкого функционала. Все, что нужно будет добавить, решу с помощью плагинов или собственного кода.
Плагины
Существует распространенная болезнь среди новичков в WP – плагинобоязнь. Все стараются накодить самостоятельно. Даже когда в этом нет необходимости. С одной стороны правильно, лишних инструментов стоит избегать. Многие популярные плагины включают в себя множество излишеств, становятся очень тяжелыми.
Если нужна только одна функция и плагина под нее нет, то тогда есть смысл создать нужный код самому. На самом деле, не важно, куда внесете код. В виде плагина или в functions.php он будет требовать одинаковое количество ресурсов. Перебарщивать с плагинами тоже не стоит. Чем их больше, тем больше ресурсов потребуется на работу, что может заметно замедлить сайт.
Но использовать можно, если они закрывают ваши потребности. Не бойтесь плагинов, но по возможности урезайте их количество. Чтобы ускорить сайт, уберите лишние. Ищите замены, в которых функционал консолидирован. Тестируйте, пробуйте альтернативы.
Оптимизация JS и CSS
Скрипты, порой, основная часть нагрузки на сайт. Каждый скрипт генерирует запросы, имеет определенный вес, соответственно, притормаживает сайт. Многие рекомендуют объединить скрипты в один файл и построить зависимости для него. Это очень сложный метод, способный впоследствии принести массу проблем.
В отдельно файле придется самостоятельно обновлять код, а после обновлений плагинов и темы все зависимости будут слетать и их придется строить заново. В общем, муторный метод. Поговорим лучше о тех, что более просты в реализации и не требуют огромных затрат времени на поддержку.
Отложенная и асинхронная загрузка JS
Самый простой вариант ускорить сайт WordPress — сделать загрузку скриптов более динамичной. Для этого отличным решением станет отложенная и асинхронная загрузка. Если раньше я обходился простым универсальным кодом, то со временем задача усложнилась и пришлось принять волевое решение и распределить скрипты ручками.
Как правильно все это настроить я рассказал в отдельной статье. Рекомендую ознакомиться, ведь там размести наиболее правильные с точки зрения WordPress методы оптимизации. Кликайте по заголовку.
Оптимизация CSS
В данном случае все несколько сложнее, чем с JS, для данной задачи лучше использовать плагины, о которых рассказал по ссылке. Но тут все сводится к объединению и минификации файлов стилей. Есть, конечно, и кастомные решения, но в отличии от скриптов, решение с помощью плагина получается гораздо более эффективным.
Оптимизация HTML
Все тоже сводится к минификации и удалению некоторых тегов и атрибутов. Задачу также целесообразнее доверить специальным плагинам, ведь прописать все необходимые алгоритмы довольно трудоемко. По ссылке в заголовке о CSS есть информация об этом.
Перенос скриптов в подвал
Да, убрать скрипты из head и перенести в подвал тоже можно. Достаточно добавить в файл functions.php такой код:
Плагины для ускорения WordPress
Этим «исчадиям ада» решил посвятить отдельную статью. Там много сложных настроек, к которым стоит ответственно относиться, потому, переходите по ссылке в заголовке и вникайте. Функционал попросту огромен, лично я использую PageSpeed Ninja. Мой любимый инструмент.
Полетели!
Как видите, методы для ускорения сайта на WordPress есть, главное, грамотно их использовать и не перебарщивать. Будем надеяться, что зайдя к вам на сайт, я моментально получу страницу, а не буду ожидать пол часа, пока подгрузится все.
Насколько публикация полезна?
Нажмите на звезду, чтобы оценить!
Средняя оценка 4.5 / 5. Количество оценок: 13