14 инструментов, которые я использую для аудита производительности сайта WordPress

14 инструментов, которые я использую для аудита производительности сайта WordPress

Производительность – это не просто «мой сайт загружается менее чем за x секунд». Есть еще несколько факторов, на которые нужно обратить внимание.

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

Ваши глаза – проверка зрения

Не поймите меня неправильно.

Возьмем для примера плагин Flying Pages WordPress. Это помогает предварительно выбирать внутренние страницы в фоновом режиме и мгновенно загружать страницы при навигации пользователя. Это дает гораздо лучший пользовательский опыт.

Я не видел никаких инструментов, которые могли бы их измерить.

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

Инструменты разработчика Chrome

Инструменты разработчика Google Chrome содержат несколько удобных инструментов для аудита веб-сайта. Откройте инструменты разработчика, нажав Ctrl + Shift + I или Ctrl + Opt + J.

Сетевой монитор

Сетевой монитор дает подробное представление о том, какие все запросы делает браузер, его ответ, время и т. Д.

  • Статус – Легко определить, недоступен ли какой-либо ресурс
  • Протокол – проверяет HTTP1.1, HTTP2, Quic и т. Д.
  • Тип – тип файла возвращен, легко понять, что WebP работает
  • Размер – количество переданных данных с Gzip и без него. “Disk Cache” или “Memory Cache” указывает на то, что кеширование браузера работает.
  • Приоритет – приоритет каждого файла, запрашиваемого браузером. CSS, JS, Fonts имеют высокий приоритет, изображения – Low, SendBeacon (Google Analytics), предварительная выборка ( Flying Pages ) – самый низкий.
  • Водопад – водопад запрошенных и полученных данных. Также предоставьте подробные данные поиска DNS, TCP-соединения, SSL, TTFB и т. Д. Легко отладить ленивую загрузку.
сеть инструментов Chrome Dev

Аудит

Проверьте свой сайт на производительность, PWA, лучшие практики, доступность и SEO. Вы также можете выбрать устройство и ограничить скорость сети и процессор.

Вы можете использовать инструмент «Маяк», о котором я упоминал ниже, чтобы получить те же результаты.

аудит инструментов Chrome Dev

Безопасность

Как безопасность соотносится с производительностью?

Версия TLS может существенно повлиять на TTFB. Последняя версия – TLS 1.3.

Chrome dev инструменты безопасность tls

Google PageSpeed ​​Insights

Google PageSpeed ​​Insights – один из моих любимых инструментов. Что мне нравится в нем, так это то, что он не просто сосредотачивается на «времени загрузки», а измеряет пользовательский опыт до определенного момента.

Некоторые люди жалуются, что он не показывает время полной загрузки. Я считаю, что Google не показывает этого, потому что это не лучший способ измерения сайта.

статистика скорости страницы google

Google PSI – один из лучших инструментов для анализа:

  • TTFB – Time to First Byte (время ответа сервера)
  • FCP – Первая содержательная краска
  • FMP – Первая значимая краска
  • TTI – Время интерактивности

и более

Анализатор GTmetrix

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

отчет gtmetrix

GTmetrix предоставляет водопад всех запросов, сделанных с веб-сайта, что я считаю очень полезным.

временная шкала gtmetrix

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

gtmetrix тайминги

Монитор GTmetrix

GTmetrix также поставляется с монитором, который будет периодически проверять ваш сайт и отправлять вам еженедельный дайджест. Мне больше не нужно снова и снова анализировать свой сайт, если я что-то обновляю на своем сайте.

Их бесплатный план (базовый план) предусматривает отслеживание 3 URL-адресов.

gtmetrix монитор

Тест скорости Pingdom

Pingdom Speed ​​Test – это бесплатный инструмент, предоставляемый SolarWinds. Он очень похож на GTmetrix, предоставляет вам отчет с оценками и временем загрузки.

отчет pingdom

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

поломка пингдома

Мониторинг Pingdom

Что делать, если ваш сервер иногда выходит из строя или ваш сайт недоступен для некоторых пользователей с большим трафиком?

Pingdom – это компания, занимающаяся мониторингом производительности и доступности веб-сайтов. Монитор Pingdom будет постоянно контролировать (скажем, каждые 5 минут или 30 секунд) и предупреждать вас, если что-то пойдет не так.

Нет бесплатного плана. Платный план начинается с 14,95 долларов в месяц.

монитор pingdom

WebPageTest

WebPageTest – один из старейших и надежных инструментов. Протестируйте свой сайт несколько раз с одного устройства. Очень полезно посмотреть, насколько эффективно работает «кеширование браузера». Также укажите некоторые ключевые показатели, такие как TTFB , keep-alive, сжатие , кеширование браузера , cdn и т. Д.

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

результаты тестирования веб-страницы

Тест производительности KeyCDN

Большинство перечисленных выше инструментов проверяют TTFB (время до первого байта или время ответа сервера) из одного места. KeyCDN Performance Test проанализирует ваш сайт из 14 местоположений одним нажатием кнопки и предоставит отчет о времени поиска DNS, подключении, TLS и TTFB .

tls 1.3 ttfb

Робот безотказной работы

Как и Pingdom Monitoring, Uptime Robot отслеживает время простоя вашего сайта и предупреждает вас.

Бесплатный план позволяет контролировать интервалы в 5 минут.

приборная панель робота безотказной работы

Скорость сайта Google Analytics

Google Analytics использует HTML5 Navigation Timing API для сбора показателей производительности от 1% ваших пользователей (настраивается). Вы можете просмотреть его в разделе Поведение -> Скорость сайта.

Что такого особенного в GA Site Speed, так это то, что данные собираются при реальном использовании. Все другие инструменты используют высокопроизводительную сеть или эмулируемую сеть для проведения теста, которые могут отличаться от реальных пользователей. Что, если большинство ваших пользователей все еще используют 3G?

скорость сайта Google Analytics

Loader.io

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

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

Loader.io позволяет легко отправлять на ваш сайт 10 тысяч запросов в секунду и посмотреть, как он работает.

нагрузочный тест openlitespeed 1

дотком-инструменты

dotcom-tools тестирует ваш сайт из 25 точек, как в первую, так и в повторную. Я также использую этот инструмент для предварительного создания кеша CDN после очистки.

инструменты dotcom

Маяк

Lighthouse – еще один инструмент, предоставляемый Google. Он встроен в Google Chrome.

Lighthouse тестирует производительность, доступность, лучшие практики и SEO. Отчет «Эффективность» будет таким же, как в Google PageSPeed Insights. Но в одном инструменте вы можете протестировать их все.

Вы можете протестировать его прямо на вкладке «Аудит» в браузере Chrome в инструментах разработчика или на странице https://web.dev/measure.

отчет маяка