Эта статья о производительности сайта WordPress является частью серии, созданной в сотрудничестве с SiteGround . Спасибо за поддержку партнеров, которые делают возможным использование SitePoint.
Вы не хотите медленный сайт. Потенциальные посетители могут уйти еще до того, как ваша страница загрузится. И вы будете оштрафованы в результатах поиска, что означает еще меньше трафика.
Вы хотите, чтобы ваши веб-страницы загружались в течение двух секунд или меньше. Как вы этого добиваетесь? Один шаг за раз.
В этой статье мы рассмотрим список элементов, которые вы можете оптимизировать для ускорения вашего сайта WordPress.
Насколько медленный мой сайт?
Ваш сайт может показаться вам медленным. Скорее всего, ваш браузер уже кэшировал его, поэтому вы не будете испытывать его так же, как новый посетитель.
Вот некоторые службы, которые сообщат вам, сколько времени занимает загрузка вашей страницы, и сообщат вам общий размер файла вашей страницы:
Проверяйте скорость своих сайтов до и после настройки их производительности. Если вы можете загрузить свои страницы за две секунды, у вас все хорошо.
Ведите учет того, насколько важен каждый ваш шаг. Что имело наибольшее значение?
# 1. Выберите хороший веб-хостинг
Невозможно ускорить веб-сайт, размещенный на медленном сервере. Выбор подходящего хостинг-провайдера является первым важным шагом к созданию быстро загружаемого веб-сайта.
Как вы выбираете компанию, которая делает скорость приоритетом? Проверьте наш контрольный список производительности в Окончательном руководстве по выбору хостинг-провайдера .
SitePoint недавно стал партнером SiteGround в качестве официального рекомендованного хоста . SiteGround предоставляет серверы на разных континентах и использует новейшее оборудование для твердотельных накопителей, собственный инструмент для кэширования и бесплатный сервис CDN, а также обеспечивает и инвестирует значительные средства в ускорение скорости . Их гибкие серверы поддерживают PHP7 и HTTP / 2, и они постоянно обновляют программное и аппаратное обеспечение.
# 2. Оптимизируйте свою тему
Во-первых, используйте быструю тему . Темы с большим количеством опций облегчают вашу работу, но за счет усложнения работы веб-сервера и браузера. Некоторые темы WordPress имеют размер в мегабайты, добавляя секунды к времени загрузки вашей страницы.
Каждая функция, которую вы не используете, замедляет ваш сайт без всякой причины. Если вам удобно настраивать код, выберите тему с меньшим количеством опций для ускорения вашего сайта.
- Темы WordPress по умолчанию просты в настройке, легки и хорошо закодированы. Подумайте об использовании одного из них и либо настройте код самостоятельно, либо наймите разработчика.
- Тезис и схема являются еще двумя темами, которые определяют приоритеты производительности.
Дальнейшее чтение:
- Что такое лучшая тема WordPress?
- 9 самых популярных бесплатных тем WordPress
- Как создать полноценный сайт WordPress с базовой темой и элементом
Во-вторых, используйте адаптивный дизайн . Они загружают меньше ресурсов для мобильных устройств или указывают изображения с высоким разрешением для настольных дисплеев. Мобильным пользователям не нужно загружать огромные изображения, а настольным пользователям не нужно щуриться на крошечные.
Google также предпочитает адаптивные сайты, так что ожидайте небольшого увеличения SEO, как только вы переключитесь.
# 3. Контролируйте свои плагины
Во-первых, минимизируйте количество плагинов, которые вы используете . Перед установкой любого плагина спросите, действительно ли это необходимо. Наличие большого количества установленных плагинов не будет иметь большого значения для скорости вашего сайта, но увеличивает риск установки плагинов с плохим поведением.
Во-вторых, убедитесь, что ваши плагины оптимизированы для текущей версии WordPress. Выполните некоторые исследования перед установкой плагина, особенно если он имеет рейтинг три звезды или меньше. Он может быть плохо развит или использовать неподходящие крючки. Это замедлит ваш сайт, а также может негативно повлиять на WordPress и другие ваши плагины. Также важно постоянно обновлять плагины, чтобы иметь последние улучшения производительности, исправления безопасности и функции.
# 4. Оптимизируйте свои виджеты
Ваши виджеты должны быть максимально легкими и удобными для загрузки. Некоторые загружают внешний JavaScript или CSS во время визуализации. Это распространено для виджетов социальных сетей для Facebook, Twitter и Google+.
Если виджет вряд ли будет часто обновляться, загрузите его прямо на свой сервер. Не полагаясь на внешние серверы, вы улучшите время загрузки вашего сайта.
# 5. Оптимизируйте свой статический контент
Сначала сожмите статический контент с помощью gzip . Сжатые файлы меньше, поэтому, очевидно, будут загружаться быстрее.
- Лучше всего включить сжатие gzip прямо из cPanel (если ваш хостинг предлагает вам это), если вы находитесь на общем сервере.
- Вы можете включить сжатие gzip с помощью плагина, такого как W3 Total Cache . Мы рассмотрим плагины в нашей следующей статье.
Во-вторых, снимите нагрузку с вашего веб-сервера с CDN . Ваши статические ресурсы (такие как изображения, скрипты и файлы CSS) будут обслуживаться с оптимизированных серверов доставки контента по всему миру — как правило, ближайший к вашему посетителю сервер. И ваш веб-сервер будет освобожден для обслуживания остальной части вашего сайта, улучшая производительность.
В идеале, ищите веб-хостинг, который предлагает CDN в своих планах хостинга , например SiteGround. Есть также много сетей CDN:
Эти работы с плагинами кэширования мы рассмотрим в следующий раз.
Вот еще немного о CloudFront:
# 6. Оптимизируйте ваши изображения
Изображения являются одним из самых тяжелых элементов вашего сайта: они составляют более 65% веб-контента. Есть несколько способов оптимизировать загруженные изображения.
Сначала укажите максимальные размеры изображения для миниатюр, средних и больших изображений. Вы найдете эти опции в Настройки / Медиа. Если вы загрузите изображение размером 1024 пикселя, а ваша область контента будет иметь ширину всего 604 пикселя, изображение будет уменьшено с помощью CSS. Полученное изображение размером 604px с предварительно измененным размером будет значительно меньше для загрузки.
Во-вторых, смирись ! Этот метод уменьшает размеры файлов изображений без потерь, не изменяя их размер и не снижая их качество. Хотя Yahoo убила службу Smush.it несколько лет назад, есть альтернативы, такие как reSmush.it , и несколько плагинов, о которых мы расскажем в следующей статье.
В-третьих, используйте ленивую загрузку . Этот метод эффективен для сайтов с большим количеством изображений. Изображения загружаются только тогда, когда они становятся видимыми, а не при начальной загрузке страницы. Это может значительно ускорить время загрузки страницы, хотя при отображении изображений при их прокрутке будет задержка.
Дальнейшее чтение:
В-четвертых, выберите лучший формат изображения для вашего сайта. С некоторыми форматами изображений легче работать, а другие меньше. Например, масштабируемые файлы SVG имеют меньшие размеры файлов, особенно если вы оптимизируете их для Интернета и сжимаете их с помощью gzip.
Узнайте плюсы и минусы различных форматов изображений здесь:
- Какой формат изображения подходит для вашего сайта?
- Хорошо ли использовать изображения SVG для производительности вашего сайта?
В-пятых, используйте CSS-спрайты . Производительность повышается за счет объединения множества мелких тем и разных изображений в как можно меньшее количество изображений. Узнайте больше здесь:
Наконец, ознакомьтесь с полным обзором оптимизации изображений:
# 7. Оптимизируйте свою базу данных
Страницы WordPress загружаются из базы данных MySQL. Со временем база данных может содержать много информации, которая вам больше не нужна. Оптимизация вашей базы данных удаляет эту информацию и повышает производительность.
Вы можете оптимизировать свою базу данных напрямую из phpMyAdmin. Вы также можете оптимизировать его с помощью плагинов. Мы рассмотрим их в нашей следующей статье.
# 8. Высокоскоростные сайты с кешированием
Кэширование очень эффективно при оптимизации сайтов с большим трафиком. Каждый раз, когда загружается страница WordPress, информация извлекается из вашей базы данных и файлов CSS и объединяется в файл HTML, который можно загрузить в браузер посетителя. Это требует времени.
Кэширование сохраняет эти HTML-файлы доступными для будущих посетителей, экономя значительное время. Мы рассмотрим плагины для кэширования в нашей следующей статье.
# 9. Выполнить текущее обслуживание WordPress
Поддерживайте свой сайт WordPress в отличной форме, регулярно поддерживая его. Некоторые процедуры обслуживания могут значительно ускорить процесс, в частности:
- Держите WordPress и ваши плагины в актуальном состоянии.
- Удалить старые посты ревизии.
- Удалить спам-комментарии.
Узнайте, как сделать это и многое другое здесь:
# 10. Используйте плагины производительности
Для многих задач оптимизации существуют плагины WordPress, которые позаботятся о тяжелой работе для вас. Мы рассмотрели восемь лучших плагинов, которые охватывают все основы. Мы также перечислили почти две дюжины альтернатив, чтобы вы могли найти наиболее подходящий для вас. Погрузитесь и посмотрите, что больше всего влияет на ваш сайт.
Если вы следуете нашему контрольному списку обслуживания WordPress, вы, вероятно, уже используете некоторые из этих плагинов. Так держать! Этот промысел будет продолжать накапливаться.
W3 Total Cache
- Стоимость: бесплатно
- Активные установки: 1+ миллионов
Этот плагин обеспечивает Easy Web Performance Optimization (WPO) с использованием кэширования — кэширование записей и страниц в памяти или на диске, кэширование каналов, страниц результатов поиска, объектов базы данных и минимизированных файлов CSS и Javascript. Чтобы извлечь из этого максимум пользы, потратьте некоторое время на его тщательную настройку.
W3 Total Cache также может работать с вашим CDN (например, Cloudflare или MaxCDN) для дальнейшего сокращения времени загрузки.
W3 Total Cache улучшает SEO и пользовательский опыт вашего сайта, увеличивая производительность сайта, сокращая время загрузки с помощью таких функций, как интеграция сети доставки контента (CDN).
Альтернативные плагины кэширования включают WP Super Cache , Hyper Cache , WP Fastest Cache и Cache Enabler .
Если вы предпочитаете избегать использования плагинов, хорошим вариантом для вас будет поиск хостинг-провайдера, который сделает кеширование за вас. Наш партнер SiteGround имеет отличный инструмент для кеширования, разработанный собственными силами, который может помочь вам значительно повысить скорость вашего сайта.
WP-Optimize
- Стоимость: бесплатно
- Активные установки: 600 000+
Этот бесплатный плагин оптимизирует вашу базу данных WordPress одним нажатием кнопки или автоматически с помощью встроенного планировщика. Избыточная информация, такая как спам-комментарии, сообщения о ревизиях и другие ненужные элементы, будет удалена из базы данных MySQL, что ускорит загрузку вашего сайта.
WP-Optimize — это эффективный инструмент для автоматической очистки базы данных WordPress, чтобы она работала с максимальной эффективностью.
Альтернативные плагины оптимизации базы данных включают Оптимизацию базы данных после удаления ревизий , WP Cleanup , WPOptimize , WP Database Cleaner и WP-DBManager .
Autoptimize
- Стоимость: бесплатно
- Активные установки: 300 000+
Плохо структурированные CSS и HTML приведут к замедлению работы сайта и потере трафика. Этот плагин сканирует и настраивает ваш сайт, «минимизируя» и удаляя лишний код.
Чтобы предотвратить конфликты совместимости, Autoptimize может игнорировать другие ваши плагины. Это также может заставить ваши плагины работать в определенном порядке. Экспериментируя с этим, вы можете значительно улучшить время загрузки.
Autoptimize делает оптимизацию вашего сайта действительно простой. Он объединяет все сценарии и стили, минимизирует и сжимает их, добавляет заголовки expires, кэширует их, перемещает стили в верхнюю часть страницы и может перемещать сценарии в нижний колонтитул.
Альтернативные плагины, которые минимизируют, включают WP Super Minify и Better WordPress Minify .
P3 (плагин Performance Profiler)
- Стоимость: бесплатно
- Активные установки: 100 000+
Плохие плагины могут негативно повлиять на производительность вашего сайта. P3 оценит ваш. Он определит плагины, которые оказывают наибольшее влияние на время загрузки вашего сайта, и отобразит их в виде круговой диаграммы, чтобы вы могли легко увидеть, какие настройки будут иметь наибольшее значение.
Этот плагин создает профиль производительности плагинов вашего сайта WordPress, измеряя их влияние на время загрузки вашего сайта. Часто сайты WordPress загружаются медленно из-за плохо настроенных плагинов или из-за их большого количества. Используя плагин P3, вы можете сузить все, что вызывает медлительность на вашем сайте.
Альтернативные плагины, связанные с плагинами, включают Plugin Organizer .
WP Smush
Этот плагин сжимает изображения путем извлечения метаданных из файлов JPEG, оптимизации сжатия JPEG, преобразования определенных GIF-файлов в индексированные PNG и удаления неиспользуемых цветов из проиндексированных изображений. Вы можете настроить его на автоматическое сжатие новых изображений при их загрузке на ваш сайт.
WP Smush работает быстро и хорошо работает. Файлы сжимаются с использованием выделенных серверов, и это рекомендуется инструментом повышения производительности сайта GTmetrix.com .
Изменяйте размер, оптимизируйте и сжимайте все ваши изображения с помощью невероятно мощного и 100% бесплатного средства для работы с изображениями WordPress, представленного вам супертамой на WPMU DEV!
Альтернативные плагины сжатия изображений включают EWWW Image Optimizer , Imagify , Kraken Image Optimizer , ShortPixel Image Optimizer и CW Image Optimizer .
Ленивая нагрузка
- Стоимость: бесплатно
- Активные установки: более 90000
Этот плагин гарантирует, что изображения загружаются только тогда, когда они видны выше сгиба. Не требует настройки и работает из коробки.
Ленивая загрузка изображений для улучшения времени загрузки страницы. Использует jQuery.sonar для загрузки изображения, только когда оно видно в окне просмотра.
Альтернативные плагины для отложенной загрузки включают в себя jQuery Image Lazy Load WP , BJ Lazy Load , Rocket Lazy Load , Unveil Lazy Load и Lazy Load for Videos .
Imsanity
- Стоимость: бесплатно
- Активные установки: 100 000+
Вместо того, чтобы предлагать сжатие без потерь, этот бесплатный плагин автоматически изменяет размеры изображений до более «нормального» разрешения. Он может установить максимальную ширину, высоту и качество изображений, а также может конвертировать файлы BMP в JPG.
Imsanity автоматически изменяет размер загружаемых изображений до размера, более подходящего для отображения в браузере, но все же более чем достаточно большого для типичного использования веб-сайта. Плагин настраивается с максимальной шириной, высотой и качеством.
WP HTTP Сжатие
- Стоимость: бесплатно
- Активные установки: 5000+
Этот плагин сжимает ваши страницы в формате gzip (если браузер поддерживает сжатые страницы). Сжатие HTTP может уменьшить размер ваших страниц на 60–80%, что позволяет загружать страницы в три или четыре раза быстрее.
Этот плагин позволяет вашему блогу WordPress выводить страницы, сжатые в формате gzip, если браузер поддерживает сжатие.
Вы также можете включить сжатие gzip из общего кэша W3, упомянутого выше, или в настройках панели управления вашего веб-хостинга.
# 11. Дальнейшие советы
- Очистите свой мусор. В вашей базе данных может быть много мусора, который замедлит работу вашего сайта. По умолчанию WordPress автоматически удаляет мусор через тридцать дней. Вы можете очистить корзину вручную с панели инструментов, и мы поделимся некоторыми полезными плагинами в нашей следующей статье.
- Сократите ваши файлы JavaScript и CSS, удалив все ненужные данные. CSS Minifier перечисляет некоторые инструменты, которые помогут вам сделать это.
- Отключить трекбеки и пингбеки. Они используют ресурсы сервера и базы данных каждый раз, когда кто-то упоминает ваш сайт. Отключение настройки (из настроек обсуждения WordPress) не уничтожит обратные ссылки, а только работу, которая генерируется.
Попробовать!
Как медленно ваш сайт? Используйте один из инструментов, перечисленных выше, чтобы узнать. Затем попробуйте одну или несколько стратегий и снова проверьте свою скорость. Тогда повторите.
SiteGround, наш предпочтительный хостинг-провайдер , позволяет использовать мощные методы оптимизации производительности всего за несколько кликов. Их руководство по повышению производительности WordPress включает полные учебные пособия по многим темам, которые мы рассмотрели в этой статье, включая кеширование, сжатие gzip, использование CDN, оптимизацию изображений и оптимизацию базы данных WordPress.
Какая стратегия оптимизации оказала наибольшее влияние на ваш сайт? Дайте нам знать об этом в комментариях.