
TTI, оно же Time to Interactive, оно же Время Загрузки для Взаимодействия – метрика производительности сайта, которая оценивает время, необходимое странице, чтобы стать полностью интерактивной.
Отметим, что TTI не относится к Core Web Vitals – набору из то трех важнейших показателей, которые измеряют различные аспекты пользовательского опыта. Largest Contentful Paint, First Input Delay, Cumulative Layout Shift – они там есть. Time to Interactive – нет. Кстати, в нашем цикле разъяснений по терминам можно найти отдельные статьи по первым трем. Они здесь, здесь и вот здесь.
И хоть TTI не относится к Core Web Vitals и не так сильно влияет на рейтинг сайта в поисковой выдаче, анализировать его все же стоит. Хотя бы по той причине, что хороший TTI приводит и к снижению Cumulative Layout Shift – уже вполне себе решающего показателя.
Что провоцирует плохой TTI и как это исправить
Ниже – основные причины, которые ведут к плохому показателю TTI.
Плохой код
Если страница содержит много лишнего JavaScript-кода, время загрузки будет пропорционально увеличиваться. Всегда нужно стараться избавиться от «мусора»: неиспользуемых скриптов, ошибок в самом коде и т.д. Как именно избавиться? Разбить JavaScript на несколько пакетов, например. Также можно отказаться от сторонних скриптов, подгрузка которых занимает много времени.
JavaScript – язык программирования, который добавляет интерактивность на веб-сайт.
«Внеэкранные» изображения
Внеэкранные (они же «скрытые») изображения загружаются вместе со страницей, однако не сразу видны пользователям. Это, например, картинки, расположенные в самом низу, а не в теле статьи. Избыток подобного контента приводит к тому, что браузеру требуется слишком много времени на обработку содержимого, которое изначально вообще даже не понадобится пользователям – до определенного момента они его просто не увидят.
Устраняется проблема «ленивой загрузкой». Это способ, при котором браузер вместо того, чтобы грузить все фото одновременно, подгружает их постепенно: либо после полного отображения страницы, либо когда пользователь отмотает до нужного места. Вариант особенно удобный, если на странице много изображений.