Как измерить скорость продукта и улучшить пользовательский перфоманс

НачалоМетрики скорости продуктаИногда метрики скорости врутЗамедление показа контентаЗамедление интерактивностиВыводы

Никита Сидоров, руководитель службы инфраструктуры пользовательской скорости в Яндексе, исследует связь перфоманса и бизнес-метрик продукта. Он рассказал об экспериментах с замедлением на разных экранах Яндекс Маркета и о том, как они повлияли на конверсию.

Комфортная для клиента скорость — одна из ключевых характеристик качества продукта, поэтому важно уметь замерять и контролировать Web Vitals — набор показателей, которые влияют на клиентский перфоманс.

К Web Vitals относятся метрики показа:

  • FCP (first сontentful paint) → скорость загрузки первого контента на странице
  • LCP (largest contentful paint) → скорость загрузки основного контента
  • Интерактивность → скорость реакции на действия пользователя

и метрики взаимодействия со страницей:

  • TBT (total blocking time) → сумма блокировок интерфейса на время более 50 миллисекунд
  • FID (first input delay) → задержка при обработке первого действия пользователя (клика или скролла)
  • INP (interaction to next paint) → задержка обновления интерфейса при взаимодействии со страницей в течение всей пользовательской сессии

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

Высокие баллы по Web Vitals — это ещё не гарантия того, что пользователь действительно видит быструю загрузку страницы. Одна из причин — редирект. После обработки поискового запроса на страницу в Маркете подтягиваются независимые URL, и FCP считается отдельно для каждого из них. Ещё важно учитывать, что браузер Safari неправильно репортит стандартную метрику FCP. Чтобы видеть корректные показатели, лучше писать свой пакет, который будет репортить свои версии метрик.

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

Расчет LCP, скорости загрузки основного контента, зависит от того, что браузер определяет главным элементом на странице

Чтобы исправить эту проблему, можно попробовать внедрить Hero-элементы. Для этого нужно определить, какая продуктовая фича самая важная, и назначить её ключевым элементом страницы. Например, для команды поиска это может быть органический результат поисковой выдачи, для команды рекламы — рекламная врезка.

Важно, чтобы метрики скорости были приближены к продукту. Например, мы проводили эксперимент с показом блока «Вы это заказывали»:

С точки зрения метрик Web Vitals оба интерфейса работают одинаково

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

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

Мы проводили А/В-эксперименты, чтобы посмотреть, как замедление на разных экранах влияет на метрики. Хотели проверить гипотезы:

  • Web Vitals влияет на конверсию страницы
  • Функциональность некоторых элементов интерфейса не покрывается Web Vitals, но их наличие и быстрая работа растит ключевые продуктовые метрики

При замедлении на одном из главных экранов Маркета — «Карточка модели» — статистически значимые изменения произошли только на одной секунде. Нажатие кнопки «В корзину» снизилось на 1% при замедлении на секунду и почти на 2% при замедлении на две секунды.

Результаты замедления контента на экране «Карточка модели»

Переходы из блока «Ещё может подойти» тоже упали: —2% при задержке на секунду и —3% при задержке на две секунды.

Отдельно смотрели на действия новых пользователей сервиса — для них замедление оказалось более чувствительным. При значении 0,5 секунды количество просмотренных страниц снизилось почти на 2%.

Заметили интересный эффект при замедлении контента на странице «Поиск». При значении 0,5 секунды получили —4% кликов на товары, но при этом люди перешли на другую страницу и начали скроллить рекомендательные ленты, рост кликов рекомендаций вырос на 11%. В итоге оттока лояльных пользователей не произошло.

Иногда при замедлении контента можно увидеть рост бизнес-метрик, но таким данным доверять нельзя. Например, при замедлении контента под рекламным блоком «Скоро в продаже» мы задерживаем пользователя на странице и дольше показываем ему рекламу.

Замедлили показ товаров из органической выдачи — подняли время просмотра рекламного блока «Скоро в продаже»

Рекламная метрика CPM растёт, но это нечестно и плохо для интегральных метрик продукта.

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

Результаты замедления интерактивности на экране «Карточка модели»

Когда не работают клики и скролл, эффект получается в 1,5 раза больше, чем показ контента.

В «Корзине» интерактивность тоже оказалась важнее. Здесь ключевое действие — переход к оформлению заказа. Для бизнеса замедление этой страницы ещё хуже, чем замедление карточки товара.

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

→ Метрики LCP и TBT хорошо работают «из коробки». Они действительно показывают пользовательский опыт и могут помогать влиять на business value. У FCP есть проблема, связанная с Safari. Стандартной браузерной метрике FCP доверять нельзя, нужно писать свою.

→ Правильно настроенные метрики Web Vitals влияют на конверсии внутри приложения и, как следствие, на интегральную конверсию. Как работать с метриками скорости и готовить эксперименты с технической точки зрения — смотрите в записи доклада на Ютубе.

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

Поделитесь увиденным

Скопировать ссылку
ТелеграмВКонтакте