Как относиться к скоростным инструментам

Как относиться к скоростным инструментам

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

Скачать PDF-версию

Распространенные мифы о производительности

Миф 1

Лист бумаги с линейным графиком.

Пользовательский опыт можно отразить с помощью одной метрики.

Хороший пользовательский опыт не фиксируется в какой-то момент времени. Он состоит из ряда ключевых этапов на пути ваших пользователей. Понимайте различные показатели и отслеживайте те, которые важны для опыта ваших пользователей.

Миф 2

Коллекция сетевых значков, представляющих различные устройства и условия сети.

Пользовательский опыт может быть зафиксирован с помощью одного «репрезентативного пользователя».
Реальная производительность сильно варьируется из-за различий в устройствах пользователей, сетевых подключениях и других факторах. Откалибруйте свою лабораторию и среду разработки, чтобы протестировать множество таких разных условий. Используйте полевые данные для выбора параметров тестирования для типа устройства (например, мобильного или настольного компьютера), сетевых подключений (например, 3G или 4G) и других ключевых переменных.

Миф 3

Ассортимент изображений разных пользователей.

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

Понимание лабораторных и полевых данных

Лабораторные данные

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

Лабораторные данные — это данные о производительности, собранные в контролируемой среде с заранее заданными настройками устройства и сети. Это обеспечивает воспроизводимые результаты и возможности отладки, помогающие выявлять, изолировать и устранять проблемы с производительностью.

Делать

Сильные стороны

  • Полезно для отладки проблем с производительностью.
  • Сквозная и глубокая видимость UX
  • Воспроизводимая среда тестирования и отладки
Не

Ограничения

  • Может не учитывать реальные узкие места
  • Невозможно коррелировать с реальными ключевыми показателями эффективности страницы.

Данные поля

Изображение людей в публичном месте с использованием мобильных устройств.

(Также называется мониторингом реальных пользователей или RUM)

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

Делать

Сильные стороны

  • Захватывает реальный опыт пользователя
  • Обеспечивает корреляцию с ключевыми показателями эффективности бизнеса.
Не

Ограничения {: .compare-worse }

  • Ограниченный набор метрик
  • Ограниченные возможности отладки

Каковы различные инструменты производительности?

Маяк

Маяк

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

Веб-ПейджТест

Веб-ПейджТест

Позволяет сравнивать производительность одной или нескольких страниц в контролируемой лабораторной среде, а также глубоко погружаться в статистику производительности и тестировать производительность на реальном устройстве. Вы также можете запустить Lighthouse на WebPageTest.

ТестМойСайт

ТестМойСайт

Позволяет диагностировать производительность веб-страницы на разных устройствах и предоставляет список исправлений для улучшения работы с Webpagetest и PageSpeed ​​Insights.

Статистика PageSpeed

Статистика PageSpeed

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

Карта показателей скорости

Карта показателей скорости

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

Калькулятор воздействия

Калькулятор воздействия

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

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

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

Позволяет профилировать время выполнения страницы, а также выявлять и устранять узкие места производительности.

Итак, ты…

Значок книги с диаграммами и графиками.

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

  • Используйте систему показателей скорости , чтобы сравнить скорость вашего мобильного сайта со скоростью аналогичных сайтов в более чем 10 странах. Оценки основаны на реальных данных из отчета об опыте пользователей Chrome.
  • Используйте калькулятор воздействия , чтобы оценить потенциальную возможность получения дохода от повышения скорости вашего мобильного сайта. Влияние определяется сравнительными данными Google Analytics.
  • Используйте TestMySite , чтобы проверить время загрузки вашей страницы на мобильных устройствах в соответствии с отраслевыми показателями и узнать, как простые исправления могут ускорить ваш сайт и уменьшить потерю посетителей; TestMySite в настоящее время работает на базе WebPageTest и PageSpeed ​​Insights.
Значок ноутбука с логотипом Chrome позади и немного над ним.

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

PageSpeed ​​Insights помогает вам понять реальную производительность вашего сайта с точки зрения пользователей Chrome и рекомендует возможности оптимизации.

Значок страницы результатов аудита Lighthouse.

Разработчик пытается понять и проверить веб-сайт на предмет соответствия современным практикам веб-производительности.

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

Значок лупы над ошибкой.

Разработчик ищет технические рекомендации по отладке/углубленному изучению производительности вашего сайта.

Инструменты разработчика Chrome (CDT) содержат панель производительности, которая позволяет вам детально изучить проблемы с производительностью вашего сайта, профилируя его с помощью настраиваемых конфигураций, что позволяет отслеживать узкие места в производительности. Вы можете использовать CDT как в производственной, так и в разрабатываемой версии веб-сайта.

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