Если вы хотите создавать успешные веб-сайты WordPress для себя или своих клиентов, то изучение того, как ускорить работу сайта WordPress, крайне важно. Хотя многие люди по праву сосредоточены на дизайне и содержании сайта, скорость загрузки сайта не менее важна, если не более. Время загрузки влияет на удобство пользования сайтом, рейтинг SEO, конверсию, количество отказов и многое другое. Однако понять все тонкости и нюансы производительности WordPress может быть сложно, поэтому мы создали это огромное руководство о том, как ускорить работу вашего сайта WordPress. В этом посте мы расскажем обо всем, что вам нужно знать. Мы начнем с объяснения того, что замедляет работу сайтов WordPress, почему скорость важна, и как проверить текущую производительность сайта. Затем мы поделимся полным списком действенных тактик, которые вы можете использовать для улучшения производительности вашего сайта WordPress уже сегодня.
Почему ваш сайт WordPress работает медленно?
Существует две большие категории проблем, которые могут замедлять работу вашего сайта WordPress:
- Производительность бэкенда – в широком смысле это то, сколько времени требуется вашему серверу для доставки файлов.
- Производительность фронтенда – это то, насколько оптимизирован сам сайт WordPress.
Проблемы с производительностью бэкенда обычно связаны с хостингом. Например, использование медленного хостинга является одним из самых больших виновников низкой производительности бэкенда. Вы также можете ускорить работу бэкенда, сделав свой сервер более эффективным с помощью таких тактик, как кэширование страниц, использование последней версии PHP, оптимизация базы данных и многое другое. Проблемы с производительностью фронтенда в большей степени зависят от выбора, который вы делаете при создании сайта WordPress. Некоторые из распространенных проблем включают:
- Использование слишком большого количества плохо оптимизированных плагинов WordPress
- Использование тяжелой темы WordPress
- Загрузка больших, неоптимизированных изображений
- Наличие неоптимизированного JavaScript или CSS
- Загрузка слишком большого количества сторонних скриптов
Если вы хотите добиться максимальной производительности вашего сайта, вам необходимо оптимизировать оба типа производительности. Например, даже сайт с идеальной оптимизацией фронтенда может загружаться медленно, если он находится на очень медленном хостинге (и наоборот). Наши советы, приведенные ниже, помогут устранить оба типа проблем.
Почему важна скорость сайта WordPress?
Если вы когда-либо пользовались медленно загружающимся сайтом, вы интуитивно понимаете, как неприятно иметь дело с медленным сайтом. Это раздражает, и ваши посетители будут раздражены, если им придется ждать, пока загрузится ваш контент (особенно на мобильных устройствах). Итак, на базовом уровне, одна из основных проблем медленной работы сайта WordPress заключается в том, что она создает действительно плохой пользовательский опыт для ваших посетителей, а это то, чего вы всегда должны стремиться избежать. Однако у медленного сайта есть и множество специфических недостатков:
SEO-рейтинг – Google использует скорость сайта в качестве фактора ранжирования как в результатах для настольных компьютеров, так и для мобильных устройств. В ближайшее время Google также начнет использовать метрику Core Web Vitals, которая включает в себя показатель скорости. Скорость сайта может быть особенно важна в конкурентных нишах с большим количеством сильных сайтов, где она является отличительным фактором между двумя одинаково сильными сайтами. Вот мнение Google.
Коэффициент конверсии – медленное время загрузки ведет к снижению коэффициента конверсии. По данным Akamai, даже 100-миллисекундная задержка может снизить конверсию на 7%. Компания Deloitte также обнаружила, что улучшение скорости работы сайта всего на 100 миллисекунд приводит к тому, что покупатели тратят на 10% больше.
Коэффициент отказов – медленное время загрузки приводит к более высоким показателям отказов. Например, компания Pingdom установила, что показатель отказов, связанный с временем загрузки, для страницы, которая загружается за две секунды, составляет 6%, но этот показатель возрастает до 38% для страницы, которая загружается за пять секунд. На мобильных устройствах Google обнаружил, что вероятность того, что кто-то откажется от страницы, возрастает с 32% при загрузке в течение 1-3 секунд до 90% при загрузке в течение 1-5 секунд. Скорость сайта также особенно важна для мобильных устройств: 53% мобильных посетителей покинут страницу, которая загружается дольше трех секунд.
Как измерить скорость сайта WordPress
Самый простой способ проверить производительность вашего сайта WordPress – использовать инструмент для тестирования скорости. С помощью такого инструмента вам нужно только ввести URL страницы, которую вы хотите протестировать, и инструмент предоставит вам кучу данных для оценки ее производительности. Вот некоторые из лучших бесплатных инструментов для тестирования скорости:
- WebPageTest – предлагает множество переменных тестирования для сбора более полезных данных.
- Инструменты Pingdom – введите URL-адрес, чтобы проверить время загрузки страницы, проанализировать его и найти узкие места.
- GTmetrix – довольно гибкий, если вы зарегистрируете бесплатный аккаунт.
- Google PageSpeed Insights – предоставляет реальные данные о скорости от Google, а также тестирование от Lighthouse.
Если вы хотите получить точные данные, необходимо обратить внимание на несколько переменных теста:
- Устройство – попробуйте протестировать как настольные, так и мобильные устройства.
- Место проведения тестирования – в идеале, вы должны проводить тестирование из места, которое находится ближе всего к вашей целевой аудитории. Если ваша аудитория находится по всему миру, вам следует проводить тестирование в нескольких местах.
- Скорость соединения – скорость интернет-соединения ваших посетителей влияет на то, насколько быстро загружается ваш сайт. Однако некоторые инструменты тестирования скорости используют для тестирования сверхбыстрое соединение, в результате чего ваш сайт выглядит быстрее, чем он будет загружаться у реальных пользователей. В идеале, вы хотите выбрать скорость соединения, которая соответствует реальной ситуации ваших пользователей.
Например, вот тестовая конфигурация для проверки скорости вашего сайта для мобильных посетителей на 4G-соединении:
Что означают результаты тестирования? Как насчет “баллов”?
Запустив тест скорости, вы получите множество различных цифр (точные цифры зависят от используемого инструмента). В целом, вам следует сосредоточиться на фактическом времени загрузки, а не на “показателях”. Хотя показатели могут служить полезным руководством для оптимизации сайта, посетителей интересует только время загрузки сайта. Что касается фактического времени загрузки, то вы увидите разные цифры. В целом, вам стоит обратить внимание как на время полной загрузки (сколько времени требуется всему сайту для загрузки), так и на такие показатели “пользовательского опыта”, как Largest Contentful Paint (LCP), который измеряет, сколько времени требуется “основному содержанию” вашего сайта, чтобы стать видимым (даже если ваш сайт все еще загружает нижележащее содержание и скрипты).
Что такое хорошее время загрузки сайта?
В целом, хорошее время загрузки сайта составляет менее двух-трех секунд. Для мобильных пользователей Google рекомендует менее трех секунд. А для магазинов электронной коммерции следует стремиться к показателю менее двух секунд. Однако помните, что время полной загрузки сайта – это не единственный важный показатель. Вы также должны обратить внимание на “воспринимаемое” время загрузки сайта, то есть на то, насколько быстро посетители “чувствуют” ваш сайт. По словам Google: “Largest Contentful Paint (LCP) – это важная, ориентированная на пользователя метрика для измерения воспринимаемой скорости загрузки, поскольку она отмечает момент загрузки страницы, когда, скорее всего, загрузилось основное содержимое страницы – быстрый LCP помогает убедить пользователя в том, что страница полезна”. Google рекомендует, чтобы время LCP не превышало 2,5 секунды, а в 2021 году начнет использовать этот критерий в качестве фактора SEO ранжирования.
Как оптимизировать скорость сайта WordPress
Теперь перейдем к некоторым действенным тактикам, которые вы можете применить для ускорения работы вашего сайта WordPress…
1. Используйте быстрый хостинг WordPress
Выбор хостинга WordPress с оптимизированной производительностью – одна из самых важных вещей, которые вы можете сделать для улучшения производительности бэкенда вашего сайта. Проще говоря, если ваш хостинг медленный, есть большая вероятность того, что ваш сайт будет медленным, даже если вы проделаете действительно хорошую работу по оптимизации фронтэнда. Для достижения максимальной производительности вам следует рассмотреть варианты управляемого хостинга WordPress, такие как Kinsta, WP Engine или Flywheel. Если это не по карману, более дешевые варианты, такие как SiteGround и A2 Hosting, все равно помогут вам добиться быстрого времени загрузки. Для получения дополнительной информации ознакомьтесь с нашим списком рекомендуемых хостингов WordPress. У нас также есть руководство о том, как выбрать хостинг WordPress, чтобы помочь вам с принятием решения. При выборе хостера следует также обратить внимание на доступное местоположение сервера. Физическое расположение вашего сервера будет влиять на время загрузки страниц, поскольку физическое расстояние влияет на скорость загрузки. В идеале, вы должны выбрать хостера, который предлагает сервер, расположенный в том же месте, где находится ваша основная целевая аудитория. Еще один важный момент – обратите внимание на современные технологии, такие как HTTP/2, которые могут улучшить производительность HTTPS, а также лучше обрабатывают множество небольших HTTP-запросов.
2. Используйте кэширование страниц
Внедрение кэширования страниц – одна из самых важных вещей, которые вы можете сделать для производительности вашего сайта WordPress, особенно если вы начинаете с дешевого виртуального хостинга. Если вы пользуетесь дешевым виртуальным хостингом, то время загрузки сайта может сократиться вдвое только за счет активации кэширования. Обычно серверу вашего сайта WordPress приходится собирать каждую страницу с нуля, когда кто-то посещает ваш сайт. Это включает в себя выполнение PHP для “создания” страницы и запрос к базе данных сайта для получения содержимого страницы. После этого ваш сервер передает готовый HTML в браузер посетителя. Этот процесс занимает время и использует ресурсы, что негативно сказывается на производительности вашего сайта:
- Из-за этого индивидуальные визиты занимают больше времени.
- Он использует больше ресурсов для каждого посещения, что означает, что ваш сайт будет еще больше замедляться в периоды высокой посещаемости.
Кэширование страниц устраняет эту проблему, сохраняя готовый HTML-продукт страницы в кэше. Затем, при последующих посещениях, ваш сервер может просто доставить этот HTML, не выполняя всю последующую работу. Многие хостинги WordPress теперь реализуют кэширование страниц автоматически, включая большинство вариантов, которые мы рекомендовали выше.
3. Используйте сеть доставки контента (CDN)
Сеть доставки контента (CDN) ускоряет глобальную загрузку вашего сайта за счет кэширования статического контента на огромной сети “граничных” серверов по всему миру. Затем, когда кто-то посещает ваш сайт, он может загрузить содержимое с ближайшего граничного сервера, а не с вашего главного сервера. Поскольку физическое расстояние меньше, файлы загружаются быстрее, и ваш сайт загружается быстрее. Некоторые хорошие CDN для пользователей WordPress включают:
- KeyCDN
- Stackpath (ранее MaxCDN)
- BunnyCDN
- Cloudflare
Многие управляемые хостинги WordPress также предлагают свои собственные встроенные CDN-сервисы без дополнительной платы. За исключением Cloudflare (у которого свой собственный процесс настройки), вы можете настроить CDN следующим образом:
- Зарегистрируйтесь в службе CDN и добавьте свой сайт.
- Используйте такой плагин, как CDN Enabler, чтобы настроить свой сайт WordPress на загрузку определенного контента из CDN.
4. Оптимизируйте изображения
В среднем, по данным HTTP Archive, изображения составляют около половины размера файла среднего веб-сайта. Это делает их огромной возможностью уменьшить размер сайта и ускорить его работу. Что касается самих изображений, то здесь есть две составляющие оптимизации:
- Изменение размеров – вы хотите изменить размеры изображения в зависимости от того, как вы его используете. Если вы включаете изображение в сообщение блога с областью содержимого шириной 800 px, то максимальный размер изображения должен составлять 1 600 px (удвоение размеров для экранов Retina).
- Сжатие – после изменения размера изображения необходимо сжать его, чтобы еще больше уменьшить размер файла. Существует два типа сжатия – с потерями (некоторая потеря качества изображения, но огромная экономия размера файла) и без потерь (нулевая потеря качества, но меньшая экономия размера файла).
Для большинства сайтов хорошей стратегией является следующая:
- Измените размер изображений в соответствии с шириной экрана (или в 2 раза больше ширины для экранов Retina).
- Сжимайте изображения с потерями (если только вы не фотограф или не работаете в другой нише, где качество изображения имеет первостепенное значение).
Один из вариантов – оптимизировать изображения перед их загрузкой. Такие инструменты, как BIRME (изменение размера) и Kraken (сжатие) предлагают массовую оптимизацию, как и Adobe Photoshop. Или вы можете использовать плагин для оптимизации изображений WordPress, чтобы автоматически оптимизировать изображения по мере их загрузки в WordPress. Вот несколько хороших вариантов:
- ShortPixel
- Imagify
- Smush
- Optimole (подробнее здесь)
Вы также можете использовать такую тактику, как ленивая загрузка. WordPress теперь поддерживает ленивую загрузку изображений в родном браузере, также вы можете использовать WP Rocket или бесплатный плагин Lazy Load. Наконец, вместо использования тяжелых GIF для анимации, подумайте об использовании короткого видео MP4 и виджета видео Elementor, который предлагает гораздо более легкий подход.
5. Оптимизируйте CSS
CSS-код вашего сайта предоставляет еще одну возможность для оптимизации внешнего интерфейса. Двумя основными стратегиями оптимизации CSS являются:
- Минифицируйте код CSS, чтобы уменьшить размер файла за счет удаления пробелов и лишних символов.
- Объедините отдельные файлы CSS, чтобы уменьшить количество HTTP-запросов. Как правило, один большой HTTP-запрос более эффективен, чем несколько маленьких HTTP-запросов (хотя разница не так велика, если ваш хост использует HTTP/2).
Для улучшения показателей производительности пользовательского опыта, таких как Largest Contentful Paint, более продвинутой тактикой оптимизации является инлайн критических CSS в тезисе и откладывание загрузки остальной части CSS на потом. Плагин Autoptimize – это популярный бесплатный вариант, позволяющий выполнить такую оптимизацию. Кроме того, многие плагины производительности предлагают такие возможности, включая WP Rocket.
6. Оптимизация JavaScript
Как и в случае с CSS, следует минифицировать и объединять JavaScript как можно чаще. Тем не менее, вам может понадобиться исключить определенные файлы JavaScript из объединения, чтобы избежать возникновения проблем. Вы можете добиться обеих оптимизаций с помощью плагина Autoptimize или WP Rocket:
Кроме того, следует как можно чаще откладывать загрузку JavaScript, чтобы избежать блокировки загрузки контента, расположенного выше разворота. Вы можете сделать это с помощью плагина Async JavaScript от того же разработчика или WP Rocket.
7. Используйте быструю тему
Являясь основой внешнего содержания вашего сайта, ваша тема играет большую роль во внешней оптимизации сайта. Если вы планируете использовать конструктор тем Elementor для создания вашего WordPress-сайта, мы рекомендуем бесплатную тему Hello, которая является самой быстрой темой для Elementor, поскольку в ней отсутствуют все ненужные функции. Проще говоря, вы не найдете более производительной основы для ваших проектов в Elementor:
Другие качественные легкие темы включают следующие:
- Астра
- GeneratePress
- Neve
Все три темы включают глубокую интеграцию Elementor и стартовые сайты.
8. Используйте быстрые плагины и ограничьте использование плагинов
Хотя существует множество замечательных плагинов, вам необходимо обратить внимание на использование плагинов, если вы хотите ускорить работу своего сайта. В целом, каждый плагин, который вы устанавливаете, увеличивает свою нагрузку в виде запросов к базе данных, HTTP-запросов и размера файла. По этой причине хорошим общим правилом является то, что чем больше плагинов вы установите, тем медленнее будет работать ваш сайт. Однако дело не только в количестве плагинов, но и в их качестве. Даже один-единственный медленный плагин может оказать огромное негативное влияние на время загрузки вашего сайта. Вот несколько основных принципов, которым следует следовать, когда речь идет о плагинах:
- Постарайтесь ограничить количество используемых плагинов. Если какая-то функция не является необходимой для функционирования вашего сайта, подумайте о том, чтобы отключить ее. Это также снизит вероятность возникновения проблем с совместимостью, которые могут еще больше повлиять на время загрузки.
- Используйте плагины только от авторитетных разработчиков с хорошим качеством кода.
Один из простых способов избавиться от необходимости устанавливать лишние плагины – использовать Elementor и/или Elementor Pro. Поскольку Elementor включает встроенные виджеты для ряда важных действий, вы можете использовать его, чтобы избежать установки дополнительных плагинов и ускорить работу вашего сайта. Например, вы можете использовать Elementor для контактных форм, иконок социальных акций, слайдеров, галерей и многого другого. Это все функции, для которых обычно требуется отдельный плагин.
9. Оптимизируйте свою базу данных
База данных вашего сайта WordPress – это то, что содержит все содержимое и настройки вашего сайта (включая дизайн Elementor). Когда кто-то посещает ваш сайт WordPress, серверу необходимо сделать запрос к базе данных, чтобы получить всю информацию, необходимую для отображения страницы (хотя, как мы уже говорили выше, кэширование страниц может устранить этот процесс для большинства посетителей). В целом, чем больше и сложнее ваша база данных, тем дольше будут выполняться эти запросы, что негативно скажется на производительности вашего сайта, а также приведет к трате ресурсов вашего сервера. По этой причине вы должны регулярно чистить базу данных своего сайта. Вот несколько плагинов, которые могут помочь в этом:
- Оптимизация базы данных после удаления изменений (рисунок ниже)
- WP Rocket
- WP-Optimize
10. Ограничить или отключить изменения
Одной из основных причин беспорядка в вашей базе данных являются правки постов. По умолчанию WordPress сохраняет неограниченное количество правок каждый раз, когда вы нажимаете кнопку “Сохранить черновик” во время работы над материалом. Чтобы избежать беспорядка, вам следует отключить или, по крайней мере, ограничить возможность редактирования постов. Это можно сделать с помощью бесплатного плагина WP Revisions Control. Или же вы можете добавить один из этих фрагментов кода в файл wp-config.php вашего сайта:
Ограничение (хранить две ревизии):
define(‘WP_POST_REVISIONS’, 2);
Отключить:
define(‘WP_POST_REVISIONS’, false);
11. Оптимизируйте свои комментарии
Если на вашем сайте есть раздел комментариев, он может значительно снижать производительность сайта. По умолчанию каждый комментарий добавляет внешний HTTP-запрос к Gravatar для загрузки изображения пользователя. Комментарии также увеличивают вес вашей базы данных и добавляют дополнительные запросы к базе данных для загрузки комментариев. Если вы не находите смысла в комментариях, один из вариантов – полностью отключить комментарии:
- Перейдите в Настройки → Обсуждение
- Снимите флажок, чтобы разрешить людям отправлять комментарии
12. Выгрузка медиафайлов
Если вы используете много медиафайлов (например, изображений), это может стать большой нагрузкой на ваш сервер, поскольку серверу необходимо хранить и обслуживать все эти изображения. Один из способов снизить эту нагрузку – использовать CDN. CDN “забирает” изображения с вашего сервера в кэш CDN и затем обслуживает изображения из кэша. Однако при этом все равно расходуются ресурсы, поскольку CDN необходимо запрашивать ваш сервер, чтобы получить эти изображения. Чтобы исправить это, вы можете рассмотреть возможность выгрузки медиафайлов во внешнее хранилище, такое как Amazon S3, DigitalOcean Spaces, Google Cloud Storage и т.д. Вы по-прежнему можете использовать CDN, но теперь CDN будет “тянуть” медиафайлы из облачного хранилища, а не с сервера вашего сайта. Чтобы настроить это на WordPress, вы можете использовать плагин WP Offload Media от Delicious Brains.
13. Используйте сжатие Gzip
Gzip – это технология, позволяющая сжимать данные на уровне сервера, что может привести к уменьшению размера файлов вашего сайта на 70%+. Большинство плагинов производительности WordPress могут включить Gzip-сжатие для вас, включая WP Rocket. Или вы можете использовать отдельный плагин Enable Gzip Compression. Если вы предпочитаете не использовать плагин, вы также можете включить Gzip-сжатие, добавив этот фрагмент кода в файл . htaccess вашего сайта:
<IfModule mod_deflate.c> # Compress HTML, CSS, JavaScript, Text, XML and fonts AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE application/x-font AddOutputFilterByType DEFLATE application/x-font-opentype AddOutputFilterByType DEFLATE application/x-font-otf AddOutputFilterByType DEFLATE application/x-font-truetype AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE font/opentype AddOutputFilterByType DEFLATE font/otf AddOutputFilterByType DEFLATE font/ttf AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE image/x-icon AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/xml # Remove browser bugs (only needed for ancient browsers) BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4.0[678] no-gzip BrowserMatch bMSIE !no-gzip !gzip-only-text/html Header append Vary User-Agent </IfModule>
14. Используйте кэширование браузера (заголовки Cache-Control и Expires)
Кэширование при просмотре позволяет указать браузеру посетителя хранить статические активы на локальном компьютере посетителя. При последующих посещениях браузер посетителя будет загружать эти файлы из локального кэша, а не с вашего сервера, что ускоряет время загрузки. Для управления поведением браузера при кэшировании можно использовать две тактики:
- Cache-control
- Заголовки истечения срока действия
Они позволяют указать браузерам посетителей, как долго хранить определенные типы файлов в кэше браузера. Например, “хранить изображения PNG в течение 30 дней перед повторной загрузкой”. Оба варианта достигают одинакового эффекта, но cache-control является более новым и гибким вариантом. Вы можете использовать оба варианта – просто убедитесь, что длительность хранения совпадает. Существует два способа добавления заголовков cache-control или expires:
- Плагин
- Код
Многие плагины производительности WordPress уже содержат функции для реализации кэширования браузера, включая WP Rocket. Или вы можете использовать отдельный плагин Add Expires Headers. Если вам удобно работать с кодом, вы также можете настроить эту функцию, отредактировав файл . htaccess вашего сайта (при использовании Apache) или файл конфигурации Nginx (при использовании Nginx). Вот фрагменты кода, которые вам понадобятся:
Apache cache-control (. htaccess):
<filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|svg|js|css|swf)$">
Header set Cache-Control "max-age=84600, public"
</filesMatch> Заголовки истечения срока действия Apache (. htaccess):
## START ADD EXPIRES HEADERS ## <IfModule mod_expires.c> ExpiresActive On ExpiresByType image/jpg "access 1 year" ExpiresByType image/jpeg "access 1 year" ExpiresByType image/gif "access 1 year" ExpiresByType image/png "access 1 year" ExpiresByType image/svg "access 1 year" ExpiresByType text/css "access 1 month" ExpiresByType application/pdf "access 1 month" ExpiresByType application/javascript "access 1 month" ExpiresByType application/x-javascript "access 1 month" ExpiresByType application/x-shockwave-flash "access 1 month" ExpiresByType image/x-icon "access 1 year" ExpiresDefault "access 2 days" </IfModule> ## END ADD EXPIRES HEADERS ##
Nginx cache-control:
location ~* .(js|css|png|jpg|jpeg|gif|svg|ico)$ {
expires 30d;
add_header Cache-Control "public, no-transform";
}
Nginx expires headers:
location ~* .(jpg|jpeg|gif|png|svg)$ {
expires 365d;
}
location ~* .(pdf|css|html|js|swf)$ {
expires 2d;
} 15. Используйте предварительное подключение и предварительную выборку для важных ресурсов
Preconnect и prefetch – это две тактики ускорения времени разрешения DNS для сторонних ресурсов, что может ускорить время загрузки ресурсов. Например, вы можете указать браузерам предварительно подключаться к вашей CDN или CDN Google Fonts.
16. Управляйте своими скриптами, чтобы избежать загрузки сайта
Многие плагины WordPress загружают свои скрипты на весь сайт, даже если вы используете плагин только на некоторых страницах. Это может привести к ненужному снижению производительности на страницах, где вы не используете этот плагин. Например, допустим, вы используете WooCommerce в качестве системы обработки платежей для вашего онлайн-курса. Даже если вы не создаете полноценный магазин электронной коммерции, WooCommerce все равно будет загружать свои скрипты на каждой странице, как будто у вас работает магазин WooCommerce. Чтобы исправить это, вы можете использовать плагин, который позволяет условно контролировать использование скриптов на каждой странице. Два хороших варианта:
- Asset CleanUp – бесплатно (на фото ниже)
- Perfmatters – платные
Цель состоит в том, чтобы загружать каждый скрипт только в том контенте, где он абсолютно необходим, и отключать его везде:
17. Остерегайтесь автозагрузки данных из плагинов
Подобно тому, как некоторые плагины загружают свои скрипты на весь сайт, некоторые плагины также используют подобную тактику в вашей базе данных через автозагрузку данных в таблице wp_options. Что еще хуже, многие плагины не очищают свои данные, даже если вы удалите плагин. Это может замедлить время запросов к базе данных, особенно на старых сайтах.
18. Ограничить использование сторонних скриптов
Сторонние скрипты – это такие элементы, как:
- Скрипты отслеживания – Google Analytics, Hotjar и т.д.
- Социальные медиа – Facebook Pixel, кнопки “нравится” и т.д.
- Сторонняя реклама – Google AdSense, Media.net и т.д.
- Некоторые инструменты A/B тестирования – Google Optimize, VWO и т.д.
- И т.д.
Использование сторонних скриптов может быть особенно тяжелым для производительности сайта, потому что у вас гораздо меньше контроля над оптимизацией этих скриптов. Например, вы не можете контролировать их поведение при кэшировании в браузере, и каждый сторонний скрипт также добавляет дополнительное время разрешения DNS. По этой причине вы хотите максимально ограничить использование сторонних скриптов. Подумайте хорошенько, добавляет ли каждый скрипт достаточно ценности для вашего сайта, чтобы оправдать снижение производительности. Для большего контроля вы также можете рассмотреть возможность локального размещения некоторых скриптов, таких как:
- Google Analytics – используйте CAOS или WP Rocket
- Facebook Pixel – используйте WP Rocket
19. Используйте плагин, повышающий скорость
Некоторые из вышеупомянутых задач можно выполнить с помощью плагина скорости WordPress. На самом деле, использование этих плагинов может предотвратить возникновение проблем в первую очередь, гарантируя, что ваш сайт WordPress правильно оптимизирован при добавлении медиа или контента. Настоятельно рекомендуемый плагин – WP Offload Media. Он ускоряет работу сайта WordPress за счет выгрузки медиафайлов в облачное хранилище, например, Amazon S3 или DigitalOcean Spaces, а затем молниеносно передает их с помощью CDN. (Он также имеет интеграцию с Elementor).
Баланс между высокой скоростью сайта и отличным дизайном сайта
Помимо всего, что мы рассмотрели, важно помнить, что идеального решения для скорости не существует. Все сводится к тестированию, повторному тестированию и, прежде всего, к поиску баланса между тем, что должен предоставить наш сайт, и тем, как быстро мы его доставим. Иногда наша задача, как веб-создателей, состоит в том, чтобы поразить воображение нашей аудитории, но иногда мы рискуем скоростью. Но именно в этом случае творчество и изобретательность процветают – в рамках ограничений.
