Время до интерактивности (TTI)
Time to Interactive (TTI) — это один из шести показателей, отслеживаемых в разделе «Производительность» отчета Lighthouse. Каждый показатель отражает определенный аспект скорости загрузки страницы.
Измерение TTI важно, потому что некоторые сайты оптимизируют видимость контента за счет интерактивности. Это может расстроить пользователя: сайт выглядит готовым, но когда пользователь пытается с ним взаимодействовать, ничего не происходит.
Lighthouse отображает TTI в секундах:
Что измеряет TTI #
TTI измеряет, сколько времени требуется странице, чтобы стать полностью интерактивной. Страница считается полностью интерактивной, если:
- На странице отображается полезный контент, который измеряется с помощью показателя First Contentful Paint,
- Обработчики событий регистрируются для наиболее видимых элементов страницы, и
- Страница реагирует на действия пользователя в течение 50 миллисекунд.
Как Lighthouse рассчитывает оценку вашего TTI #
Оценка TTI — это сравнение TTI вашей страницы и TTI для реальных веб-сайтов на основе данных из HTTP-архива. Например, сайты, работающие в девяносто девятом процентиле, отображают TTI примерно за 2,2 секунды. Если TTI вашего сайта составляет 2,2 секунды, ваша оценка TTI равна 99.
В этой таблице показано, как интерпретировать оценку TTI:
Как улучшить оценку TTI #
Одним из улучшений, которое может особенно сильно повлиять на TTI, является отсрочка или удаление ненужной работы JavaScript. Ищите возможности для оптимизации вашего JavaScript. В частности, рассмотрите возможность уменьшения полезной нагрузки JavaScript за счет разделения кода и применения шаблона PRPL. Оптимизация стороннего JavaScript также дает значительные улучшения для некоторых сайтов.
Эти два диагностических аудита предоставляют дополнительные возможности для сокращения объема работы JavaScript:
Отслеживание TTI на устройствах реальных пользователей #
Чтобы узнать, как измерить реальное значение TTI на устройствах ваших пользователей, см. страницу Google с показателями производительности, ориентированными на пользователя. В разделе «Отслеживание TTI» описывается, как программно получить доступ к данным TTI и отправить их в Google Analytics.
How to improve your overall Performance score #
Unless you have a specific reason for focusing on a particular metric, it's usually better to focus on improving your overall Performance score.
Use the Opportunities section of your Lighthouse report to determine which improvements will have the most value for your page. The more significant the opportunity, the greater the effect it will have on your Performance score. For example, the Lighthouse screenshot below shows that eliminating render-blocking resources will yield the biggest improvement:
See the Performance audits landing page to learn how to address the opportunities identified in your Lighthouse report.
Ресурсы #
- Исходный код для аудита Time to Interactive
- Руководство по оценкам Lighthouse
- Первая интерактивность и полная интерактивность
- Оптимизация запуска JavaScript
- Уменьшение полезной нагрузки JavaScript с помощью Tree Shaking
- Оптимизация сторонних ресурсов