Индекс скорости – что это такое?

Индекс скорости (speed index) в последнее время вызывает большой интерес. Но что он из себя представляет и как вычисляется? Зачем он понадобился, ведь и так достаточно различных метрик, зачем придумывать еще одну?

Что такое индекс скорости?

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

Для измерения влияющих на восприятие веб-страницы параметров существует несколько метрик, но насколько они описывают реальные впечатления пользователей?

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

Время полной загрузки тоже не всегда показательно – если оно определяется по триггеру OnLoad, то оно может оказаться больше из-за отложенной загрузки элементов, или, наоборот, механизм отложенной загрузки может выдать срабатывание этого триггера при еще практически пустом экране, например, если все визуальные элементы расположены в невидимой части страницы (below-the-fold).

Поэтому, чтобы преодолеть эти и другие ограничения существующих метрик, и был придуман индекс скорости. Он в некотором смысле слова обратен времени загрузки, и чем он меньше, тем быстрее грузится страница. Индекс скорости берет в расчет скорость загрузки видимой части страницы (above-the-fold). Такой подход гораздо лучше описывает воспринимаемую пользователем производительность страницы, но означает ли это, что другие метрики нерелевантны?

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

Насколько релевантен индекс скорости?

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

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

Как вычисляется индекс скорости?

Для вычисления индекса скорости весь визуальный контент в видимой части страницы (above the fold) делится на кванты, кадры. Для совершенно пустого экрана завершенность загрузки 0%, для полностью загруженного – 100%. Для промежуточных – соответствующее число процентов. И тогда, если кадр грузился некоторое время, то его индекс скорости вычисляется по формуле

Время загрузки*(1- завершенность/100%)

И полученные числа суммируются. Сумма и будет индексом скорости.

Вот, к примеру:

И сумма будет

500 + 450 + 350 + 200 + 50 = 1550

Чем меньше полученное число, тем лучше. Если индекс оказался меньше 1000 – это довольно не плохо. А для посетителей важно, насколько быстро загружается видимая часть страницы. Чем быстрее, тем лучше их впечатления от сайта.

Измерение индекса скорости

Есть различные решения для измерения индекса скорости. В частности, его измеряет сервис WebPageTest.org.

Ниже несколько примеров:

В этом примере страница имеет хороший индекс скорости – 1260. Видно, что уже со второго фрейма (фреймы взяты с интервалом 500 мс) весь визуальный контент уже отрисовался. И для пользователя воспринимаемое время загрузки - порядка 1 секунды.

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

Здесь больше подробностей. Первые два кадра оказались пустыми. На третьем появилась часть контента, на четвертом – еще часть, но только к пятому кадру весь визуальный контент стал видимым. Довольно медленно, и в итоге индекс скорости оказался 2377.

Заметим, что во всех трех примерах отрисовка (render start) начинается раньше, чем пользователь уже видит что-то на странице. Во втором примере рендеринг начался на 1195 миллисекунде, а видимый контент появился на 1604 миллисекунде. В третьем примере рендеринг стартовал на 1296 миллисекунде, а контент стал видимым на 1597 миллисекунде. В этом уникальность индекса скорости. Для плохо оптимизированных сайтов эта разница будет значительна – рендеринг может начаться рано, но визуальный контент появится на странице лишь спустя продолжительное время. Индекс скорости может вскрыть эту проблему и позволить вам улучшить показатели своей страницы.

Ограничения индекса скорости

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

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

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

subscribe

Подпишитесь на рассылку SearchEngines

— Статьи мировых экспертов

— Аналитические обзоры

— Важные новости

— Горячие темы с нашего форума

preview Как обеспечивается безопасность поиска в Яндексе

Как обеспечивается безопасность поиска в Яндексе

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

Оптимизация сайтов на AngularJS для краулеров Google

Заниматься поисковой оптимизацией SPA-сайтов непросто, но возможно. Автор статьи делиться собственной SEO-методикой для одностраничных приложений на AngularJS
preview Тонкости, делающие контекстную рекламу эффективной

Тонкости, делающие контекстную рекламу эффективной

Профессионализм приходит через 10 000 часов занятий своим делом. Этот закон работает и в контекстной рекламе
preview Как работать с внутренними ссылками сегодня: советы и практики

Как работать с внутренними ссылками сегодня: советы и практики

Из статьи вы узнаете об актуальных подходах к анализу, оптимизации и структурированию внутренних ссылок. Своим опытом и рекомендациями делится глава Moz Рэнд Фишкин
preview Power BI для SEO — как удобно контролировать видимость сайта

Power BI для SEO — как удобно контролировать видимость сайта

Как с помощью бесплатных инструментов Power BI и Google Sheets построить удобную платформу для отслеживания изменений видимости по собранной семантике в разрезе категорий...
preview Социальные медиа и их роль в SEO

Социальные медиа и их роль в SEO

В статье рассматривается, как социальные сети влияют на ранжирование сайтов в Google...