Как избежать катастрофы CMS: как повысить производительность сайта

Опубликовано: 2022-04-15

Никто не любит… ждать… ждать …. подожди

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

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

  • Каждый второй пользователь покинет сайт, если он загружается дольше четырех секунд. Источник: Би-би-си.
  • Задержка в одну секунду приводит к снижению удовлетворенности пользователей на 16%. Источник: LoadStorm.
  • Пятьдесят три процента посещений мобильных сайтов прекращаются, если страницы загружаются дольше трех секунд. Источник: Гугл.

Возможно, вы заметили низкую производительность сайта при проверке показателей производительности Google Core Web Vitals, но не знаете, как это исправить?

Когда ваш бизнес находится под угрозой, вы не можете позволить себе отправить новый бизнес в другое место и запятнать свой бренд, если ваша система управления контентом (CMS) будет плохо работать с цифровыми технологиями.

Ниже мы диагностируем пять распространенных виновников замедления и способы повышения производительности веб-сайта с помощью гибкой CMS, такой как WordPress VIP.

Во-первых, что на самом деле происходит, когда вы загружаете веб-приложение?

Это большая просьба к любому браузеру, который сразу же должен включиться в работу, выполняя целый ряд действий за миллисекунды. Вот тощая любезность Mozilla:

  1. Браузер обращается к DNS-серверу и находит реальный адрес сервера, на котором живет веб-сайт.
  2. Браузер отправляет сообщение HTTP-запроса на сервер с просьбой отправить копию веб-сайта клиенту. Это сообщение и все другие данные, передаваемые между клиентом и сервером, отправляются через ваше интернет-соединение с использованием TCP/IP.
  3. Если сервер одобряет запрос клиента, сервер отправляет клиенту сообщение «200 OK», что означает: «Конечно, вы можете посмотреть этот веб-сайт! Вот." Затем он начинает отправлять файлы веб-сайта в браузер в виде серии небольших фрагментов, называемых пакетами данных.
  4. Браузер собирает небольшие фрагменты в полноценную веб-страницу и отображает ее вам.

Примечание: Конечно, это не так просто, как все это. Между каждым из них есть множество более мелких шагов. А пока давайте рассмотрим пять основных причин «медленности» и то, как наша WordPress VIP CMS смягчает их.

Итак, что вызывает медленный просмотр?

Виновник 1. Отсутствие точек присутствия и CDN

Скорее всего, ваш бизнес носит глобальный характер. Это увеличивает логистическую проблему обеспечения быстрых, последовательных и стабильных соединений для пользователей с различными типами соединений на различных устройствах.

Итак, что это означает для вашего приложения?

Когда сетевой запрос инициируется на шаге 2 выше, запрос проходит через несколько сетевых переходов. Переход — это термин компьютерной сети, который относится к количеству маршрутизаторов, через которые проходит пакет от источника до пункта назначения.

В результате этих переходов от географического местоположения пользователя к вашему серверу может быть добавлено время, которое ваши пользователи испытывают во время загрузки. Этого можно избежать, предоставляя контент ближе к посетителю через сеть доставки контента (CDN) и точки присутствия (PoP).

VIP-ответ WordPress :

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

Виновник 2. Неоптимизированный носитель

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

Добавление изображения 4K и ограничение его контейнером размером 100×100 пикселей означает, что ваши пользователи должны загружать все изображение 4K. Одно изображение не вызывает особого беспокойства, но для компаний, публикующих контент в больших масштабах, загрузка страницы может легко увеличиться в геометрической прогрессии по мере увеличения количества статей, заполняющих индексную страницу.

VIP-ответ WordPress :

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

Виновник 3. Неоптимизированный Javascript и CSS

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

Чтобы решить эту проблему, современная разработка Javascript и CSS часто использует минимизацию и конкатенацию.

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

VIP-ответ WordPress :

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

Затем минимизированные и объединенные файлы кэшируются на 15 дней или до тех пор, пока не будет обнаружено изменение.

Виновник 4. Плохое использование кеша

Кэши — это специальные временные хранилища для ускорения работы. То, что они ускоряют, зависит от типа кеша.

Если вы не используете форму кэширования, вы можете серьезно повлиять на скорость отклика страницы, когда ваше приложение находится под нагрузкой.

VIP-ответ WordPress :

WordPress VIP использует несколько различных типов кэширования:

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

Все это работает в гармонии, чтобы сократить время ответа на запрос.

Проблема 5. Насыщенность подключения к базе данных

Когда содержимое вашего приложения и пользовательская база растут, те старые запросы к базе данных, которые изначально выполнялись нормально, теперь могут снизить производительность.

Когда для выполнения запросов требуется время, он занимает место в базе данных до тех пор, пока запрос не завершится. Иногда эти места заполняются очень быстро, что впоследствии препятствует выполнению дополнительных запросов. Обычно это проявляется в снижении производительности приложения до тех пор, пока база данных не обработает 500 ответов.

Насыщение соединения может происходить быстро и случайным образом, что затрудняет диагностику основной причины.

VIP-ответ WordPress :

В рамках пакета услуг WordPress VIP мы предоставляем доступ к New Relic, который помогает заблаговременно диагностировать и отслеживать потенциальные проблемы, подобные указанным выше. Это экономит время вашей команды, затраты и проблемы с обеспечением дополнительных инструментов и ресурсов, когда счет идет на секунды.

В заключение

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

Узнайте больше о WordPress VIP здесь.

Автор

Майкл Чан, старший инженер-программист, WordPress VIP