Главная страница Публикации Статьи Скорость сайта – это фича!

Скорость сайта – это фича!

Скорость сайта – это фича!

к.э.н. Лавлинский Николай Евгеньевич, технический директор ООО «Метод Лаб»

При развитии любого веб-приложения мы стараемся сделать его лучше и полезнее для пользователей, чтобы получить максимум эффекта. Огромные бюджеты расходуются на очередные фичи (возможности). В то же время многие маркетологи, продуктологи и просто менеджеры проектов забывают о такой «мелочи», как скорость. Если спросить любого пользователя, нравятся ли ему быстрые приложения, он наверняка скажет «да, конечно». Все это знают и понимают. Но о том, что скорость напрямую влияет на лояльность, вовлечение и конверсию мало кто догадывается. Получается, что скорость – это такая же фича, которая стоит вложений и даёт бизнес-эффект. Пока существует такая обстановка невежества, у вас есть реальный шанс малой кровью получить дополнительное конкурентное преимущество.

Почему важно думать о скорости?

Как скорость влияет на бизнес проще всего понять из примеров. Многие крупные компании (в основном, в США) провели собственные эксперименты. Приведём некоторые факты из этих исследований:

  • Google: увеличение времени загрузки страницы на 500 мс даёт сокращение количества запросов (и показов рекламы) на 25%. Ссылка
  • Bing: задержка загрузки страниц на 500 мс сокращают прибыль на 1,1-1,4%, задержка в 1 секунду: количество кликов -1,9%, задержка 2 секунды: -4,4% кликов. Ссылка
  • Strangeloop: задержка в 1 секунду – снижение конверсии на 3,5%, количество просмотров: -9,4%. Ссылка
  • Amazon: увеличение задержки при загрузке на 100 мс снижает продажи на 1%. Ссылка
  • DoubleClick: снижение задержки на 1,5 секунды увеличивает рекламные переходы на 12%. Ссылка
  • Facebook: 0,5 секунд задержки уменьшают просмотры страниц на 3%, 0,6 секунд ускорения загрузки дают +8% кликов по ленте. Ссылка
  • Wallmart.com: сокращение времени загрузки на 1 секунду даёт +2% конверсии. Ссылка

Подведём краткий итог: скорость может решать задачу повышения бизнес-показателей веб-сервисов. Нет точных моделей зависимости эффективности сайтов от скорости, но тенденция однозначная: лучше быстрее. Причём часто получить эффект можно от ускорения всего на 100 мс, это всего лишь 0,1 секунды – за это время можно только моргнуть! В основе таких эффектов лежат глубинные принципы из различных областей: эргономики, психологии и юзабилити. О некоторых из них мы поговорим ниже.

Скорость современных веб-приложений, как обстоят дела?

По глобальной статистике HTTP Archive (http://httparchive.org/) размер веб-страниц постоянно увеличивается. Сейчас (июль 2016 года) средний размер страницы составляет почти 2,5 Мб. То есть, сайты постоянно «толстеют», хотя скорости соединения растут достаточно медленно. Если учесть большое количество мобильных пользователей, которые имеют и будут иметь еще лет 10 медленное подключение, то ситуация со скоростью получается плачевной. И это только один аспект (объём трафика), а вместе с этим растёт сложность верстки, количество кода CSS и JavaScript, что создаёт дополнительную нагрузку на CPU мобильных устройств.

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

Для России сейчас характерна тенденция подключения к Интернету всё более мелких и отдалённых населённых пунктов, поэтому приток пользователей будет обеспечен в основном пользователями с медленным соединением и устройствами низкой мощности.

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

Какой должна быть скорость загрузки сайта?

Здесь мы добрались до сложного аспекта нашей темы. Дело в том, что наша задача: обеспечить не абстрактные абсолютные показатели, а ощущения пользователя. То есть посетители должны быть довольны скоростью, при этом ощущение скорости строго субъективное и мало осознанное. Нужна какая-то точка отсчета.

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

Основной результат исследования можно наблюдать в таблице ниже.

Задержка реакции, мс Восприятие пользователем
0-100 Мгновенная реакция
100-300 Небольшая, но заметная задержка
300-1000 Система работает, но нагружена
1000-10000 Вероятное переключение мыслей на другие задачи
10000 и более Задача отменяется (система не работает)

Как видно из таблицы, удовлетворительное значение задержки для пользователя составляет до 1000 мс (1 секунды), после этого человек скорее всего отвлечётся от задачи на сайте, что может привести к отказу.

В нашем случае за время реакции на действия пользователя нужно принять задержку между нажатием на ссылку на сайте (или вводом адреса сайта) и получением загруженного сайта.

Это же значение оптимального времени загрузки (1 секунда) положено в основу методики RAIL.

Полезно также иметь в виду, что скорость вашего сайта будут сравнивать с лучшими представителями Интернета, самыми крупными и успешными. Каждый пользователь ежедневно имеет дело с Google, Яндексом, Mail.ru, Вконтакте или Facebook. Именно эти сервисы становятся «стандартом» скорости для рядового пользователя сети. Кроме того, благодаря активной рекламе сотовых операторов и производителей смартфонов, люди ожидают одинаковой скорости при работе с мобильными устройствами и подключениями.

Как измерить скорость?

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

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

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

Наиболее ценный сервис – WebPagetest.org. Для его использования достаточно ввести адрес сайта, выбрать расположение точки тестирования (выбирать нужно как можно ближе к вашей аудитории) и поставить галку «Capture Video». Точность измерений достигается за счет принципа работы: запускается реальный браузер, который загружает сайт с заданными характеристиками подключения. После проведения теста нужно перейти по ссылке Filmstrip View и посмотреть время с первым скриншотом, показывающий нужное нам состояние.

Второй способ оценки скорости: Средства разработчиков в Google Chrome. Если включить эту панель и перейти на вкладку Network, можно включить сбор скриншотов (Capture Screenshots). При перезагрузке страницы мы получим полную картинку по прогрессу загрузки страницы. Важно при этом поставить ограничение по скорости соединения (Network Throttling), чтобы тестировать сайт в реальных условиях, эмулируя, например, мобильное соединение.

В результате мы получим время от начала загрузки до появления критичного контента.

Однако, мы рассмотрели только один аспект скорости работы сайта: первоначальную загрузку. Кроме этого существует несколько критериев скорости: плавность анимации, скорость реакции на действия, скорость прокрутки. Формальное получение этих метрик сложнее, требует специальных средств. В реальной жизни нужно посмотреть, нет ли «залипаний», «подёргиваний» при анимации элементов на странице и прокрутке, быстро ли реагируют на нажатие кнопки и панели. Если особых проблем не видно, производительность достаточная. Для оценки интерактивной скорости работы лучше использовать слабое устройство (по CPU, GPU и RAM), чтобы проблемы выявлялись проще.

Как ускорить сайт?

Допустим, мы определили проблему со скоростью сайта. Теперь нужно ускоряться. Как это сделать оптимальным образом? Ответ зависит от состояния проекта и ваших возможностей.

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

Достоинства подхода:

  • Возможность создать внутреннюю экспертизу по ускорению сайтов.
  • Создание культуры для будущих доработок.
  • Возможность дозирования усилий по бюджету/времени.

Недостатки:

  • Качество выполнения полностью зависит от уровня подготовки команды.
  • Непредсказуемый результат.
  • Могут потребоваться затраты ресурсов на обучение разработчиков.
  • Разработчики могут ввести в заблуждение: «мы всё оптимизировали».

Второй сценарий: ускорение сайта с помощью автоматизированного сервиса (CDN). Здесь мы получаем достаточно быстрый эффект практически без изменений в самом сайте. Как правило, в догрузку к ускорению предлагаются фичи по улучшению безопасности сайта.

Достоинства подхода:

  • Быстрый эффект.
  • Возможность в любой момент отказаться от сервиса.
  • Отсутствие изменений в коде веб-приложения.

Недостатки:

  • Возможны проблемы совместимости сервиса и сайта (ошибки в работе).
  • Требуются изменения в процессе разработки (дополнительные хосты для обхода кеширования и т. д.)
  • Эффективность оптимизации будет ограничена: продвинутые методики и переработка кода невозможна.
  • Оптимизируется только клиентская часть.
  • Возникают обязательные регулярные платежи (абонентская плата).
  • В случае отключения сервиса сайт возвращается в исходное состояние.

Третий сценарий: заказное ускорение внешней профессиональной командой, то есть заказ ускорения сайта в специализированной компании. В этом случае процесс начинается с аудита сайта и определения стоимости и сроков работ. Далее производится сама оптимизация сайта и демонстрация результатов. По результатам работ как правило предоставляется поддержка (для исправления возможных проблем).

Достоинства подхода:

  • Возможна полная оптимизация, с учётом всех аспектов.
  • Может включать серверную оптимизацию.
  • Не требуется обучение и участие разработчиков (хотя возможно).
  • Затраты разовые: нет абонентской платы.

Недостатки:

  • Требуется время на реализацию ускорения.

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

Окупится ли ускорение сайта?

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

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

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

Эффект = Дополнительный доход – Затраты.

Здесь «Дополнительный доход» это суммарное увеличение прибыли от продаж или сокращение расходов.

«Затраты» – стоимость ускорения сайтов + расходы по сопровождению проекта внутри компании.

В случае разового ускорения срок окупаемости рассчитывается следующим образом:

Окупаемость (мес.) = Затраты / Дополнительный доход в месяц.

В случае сервиса по ускорению можно посчитать текущую эффективность:

Эффективность (%) = (Дополнительный доход в месяц – Затраты в месяц) / Затраты в месяц.

В этих расчетах сложным моментом будет выделение дополнительного дохода от ускорения. Приведём пример: допустим мы получаем увеличение продаж на 2% (вполне реальный результат исходя из западных кейсов), валовая прибыль составляет 600000 руб. в месяц.

Дополнительный доход = 0,02 * 600000 = 12000 руб. в месяц.

При стоимости ускорения 30 000 руб., срок окупаемости = 30000 руб. / 12000 руб. = 2,5 мес.

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

Что делать после ускорения сайта?

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

  • Мониторинг скорости сайта – организовать наблюдение за реальными показателями скорости загрузки сайта (проще всего с помощью систем веб-аналитики: Яндекс.Метрика и Google Analytics).
  • Оптимизация под мобильные устройства – развивать адаптивный дизайн сайта, предоставлять альтернативные версии контента, гибридное Progressive Web Application (PWA) или разрабатывать отдельную мобильную версию.
  • Непрерывная оптимизация – внедрение процесса непрерывной оптимизации всего контента и оформления на сайте в рамках системы публикации.
  • Внедрение метрик для разработчиков – бюджет на размер страниц, время загрузки на базе синтетических тестов и веб-аналитики.
  • Ревизия технологий – периодический поиск новых решений в области ускорения сайтов: протоколы, форматы сжатия, библиотеки, стандарты.

Выводы

В настоящий момент идея использования скорости как фичи веб-приложения набирает обороты в России. Скорость можно сделать одним из конкурентных преимуществ и увеличить прибыльность проекта.

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

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

За профессиональным ускорением сайтов, а также аудитом скорости сайтов обращайтесь к нам.

Лучшее ускорение сайтов в Рунете

Ускорение сайтов

Цена от 19 900 Р