Оранжевый: новый PWA конвертирует на мобильных устройствах на 52% лучше

Новый PWA также имеет среднее время загрузки на 30% быстрее, чем старый сайт, а также улучшил показатель отказов на 12% и глубину сеанса на 18%.

Адам Скрент
Adam Skręt
Марцин Сераковски
Marcin Sierakowski
Рафал Филипек
Rafał Filipek

Orange Polska SA (часть международной группы Orange) — ведущий поставщик телекоммуникационных услуг в Польше, включая услуги мобильной и фиксированной связи, такие как голос, данные, доступ в Интернет и телевидение. Мы также предоставляем услуги ИТ и интеграции, арендуемые линии и другие телекоммуникационные услуги и оборудование с добавленной стоимостью.

Скриншоты нового PWA.

Испытание

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

Предлагая нашим руководителям, мы усилили нашу аргументацию, обратившись к нашим историческим данным о производительности в Google Analytics, чтобы четко показать корреляцию между временем загрузки и коэффициентами конверсии. Используя холодные и неопровержимые факты, мы смогли показать, что каждая дополнительная секунда загрузки страницы приводит к снижению доходов и продаж на 15–20 %.

Диаграммы, показывающие корреляцию между временем загрузки и конверсиями.
Верхняя диаграмма (оранжевого цвета) показывает коэффициент конверсии на старом сайте, сегментированный по времени загрузки. Например, первая полоса слева представляет пользователей, у которых время загрузки составило менее 2 секунд. Полоса рядом с ней представляет пользователей, у которых время загрузки составляло от 2 до 3 секунд. Нижний график (серый цвет) показывает время загрузки, которое фактически испытывали все пользователи на старом сайте.

Подход

Мы решили создать прогрессивное веб-приложение (PWA). Мы специально сосредоточились на мобильном трафике, поскольку более 75% клиентов используют наш сайт через мобильное устройство. Команда в равной степени сосредоточилась на улучшении ключевых показателей эффективности и предоставлении более увлекательного и привлекательного опыта.

Мы создали новую кросс-функциональную Scrum-команду (включая специалистов в области ИТ, бизнеса и UX), целью которой было предоставить подтверждение концепции и ответить на следующие вопросы:

  • Сможем ли мы эффективно сократить время загрузки, сохраняя при этом существенные ограничения нашего наследия?
  • Каково будет фактическое влияние на конверсию и доход?

Мы выбрали Next.js из-за множества оптимизаций, которые либо включены по умолчанию, либо легко настраиваются, например, автоматический рендеринг на стороне сервера (что особенно важно для нашего SEO), предварительная выборка данных и разделение кода. Еще одним ключевым моментом для нас было то, что Next.js позволял нам переносить страницы одну за другой, не создавая никаких проблем в наших устаревших приложениях. Тем не менее, нам пришлось управлять трансформацией в сложной среде, где мы все еще полагались на устаревшие системы, что приводило к недоступности услуг. Чтобы исправить это, мы интегрировали Workbox , чтобы наш веб-сайт всегда был доступен, даже если серверная часть не работает. Workbox также дал нам хороший прирост производительности благодаря встроенным решениям для предварительного кэширования, маршрутизации запросов и кэширования во время выполнения.

Полученные результаты

Наш новый PWA имеет среднее время загрузки на 30 % быстрее, чем старый сайт, конверсия на мобильных устройствах увеличилась на 52 %, показатель отказов увеличился на 12 %, а глубина сеанса увеличилась на 18 %. Этот опыт подтвердил стратегическое направление преобразования всех решений для работы с клиентами (включая средства самообслуживания клиентов и интерфейсы для продавцов) в сторону технологии PWA.