Resource Timing API
Resource Timing API - программный интерфейс браузера, позволяющий измерять фактическое время загрузки каждого отдельного ресурса веб-страницы: HTML, CSS, JavaScript, изображений, шрифтов и сетевых запросов. В отличие от агрегированных метрик, он показывает детальную картину того, как именно загружается сайт на уровне каждого файла.
Коротко: Resource Timing API - это «рентген сайта». Он показывает, какие именно части сайта тормозят загрузку: скрипты, изображения, сервер или сторонние сервисы. Это инструмент глубокой диагностики реальной скорости сайта.
В интернет-маркетинге Resource Timing API является фундаментальным инструментом для глубокого аудита технического состояния сайта и оптимизации индекса отзывчивости веб-ресурса. В отличие от базовых метрик, которые показывают лишь общую скорость загрузки страницы, Resource Timing API позволяет поминутно разобрать процесс доставки конкретного файла и локализовать проблему (например, задержку на стороне DNS или медленный ответ сервера).
Зачем это нужно в интернет-маркетинге
[править]В маркетинге скорость сайта - это не техническая метрика, а фактор, напрямую влияющий на деньги:
- Конверсия. Чем медленнее сайт, тем ниже конверсия, выше отказ и меньше заявок и продаж. Даже задержка в 1 секунду может влиять на поведение пользователей.
- Рекламные кампании. Для контекстной и таргетированной рекламы быстрый сайт даёт более дешёвый лид, медленный - повышает CPC и CPA. Платный трафик особенно чувствителен к задержкам.
- SEO и органика. Поисковые системы учитывают скорость загрузки, стабильность рендеринга и доступность контента. Медленные сайты хуже индексируются, теряют глубину обхода и чаще «недочитываются» ботами.
- UX и поведение пользователя. Resource Timing помогает понять, что именно тормозит первый экран, почему «визуально быстрый» сайт на самом деле медленный и какие ресурсы блокируют взаимодействие.
Что именно измеряет Resource Timing API
[править]Для каждого загружаемого файла интерфейс создаёт объект PerformanceResourceTiming, который содержит временные метки для каждого этапа сетевого взаимодействия:
|-- redirectStart / redirectEnd (Перенаправления)
|-- fetchStart (Начало извлечения)
|-- domainLookupStart / domainLookupEnd (Разрешение DNS)
|-- connectStart / connectEnd (Установление TCP-соединения)
|-- secureConnectionStart (SSL/TLS рукопожатие)
|-- requestStart (Отправка запроса серверу)
|-- responseStart (Получение первого байта / TTFB)
|-- responseEnd (Получение последнего байта)
Используя эти метки, можно вычислить чистые показатели эффективности:
- Время DNS-поиска. domainLookupEnd - domainLookupStart.
- Время создания безопасного соединения. connectEnd - secureConnectionStart.
- Время ожидания ответа (TTFB ресурса). responseStart - requestStart.
- Чистая длительность скачивания файла. responseEnd - responseStart.
Это позволяет построить waterfall загрузки сайта - детальную карту всех зависимостей.
Практический пример: как получить данные в коде
[править]Разработчики и аналитики могут извлечь данные обо всех загруженных ресурсах через консоль браузера или с помощью JS-кода:
// Получаем массив всех загруженных ресурсов на странице
const resources = performance.getEntriesByType("resource");
resources.forEach((resource) => {
// Вычисляем общее время загрузки конкретного файла
const duration = resource.duration;
if (duration > 500) { // Если ресурс грузится дольше 500 мс
console.warn(`Внимание! Ресурс ${resource.name} грузился слишком долго: ${duration.toFixed(2)} мс`);
}
});
Важное ограничение: заголовок Timing-Allow-Origin. По соображениям безопасности браузеры скрывают детальные сетевые метрики (DNS, TCP, TLS) для ресурсов, загружаемых со сторонних доменов (CDN, внешние скрипты). Чтобы открыть к ним доступ для аналитики, на стороннем сервере должен быть настроен HTTP-заголовок: Timing-Allow-Origin: * (или с указанием конкретного домена).
Resource Timing vs PageSpeed Insights
[править]| Параметр | PageSpeed Insights | Resource Timing API |
|---|---|---|
| Формат | Агрегированная оценка | Данные по каждому ресурсу |
| Глубина | Поверхностная диагностика | Низкоуровневый анализ |
| Точность | Усреднённая | Фактическая |
| Применение | Аудит сайта | Инженерная оптимизация |
PageSpeed отвечает на вопрос «сайт быстрый или нет?». Resource Timing отвечает на вопрос «почему он быстрый или медленный?».
Что можно выявить через Resource Timing API
[править]- Тяжёлые JS-бандлы. React, Vue, Angular приложения часто блокируют загрузку текста.
- Медленные сторонние сервисы. Чаты, трекеры, аналитика, рекламные скрипты.
- Проблемы CDN. Задержки гео-доставки, кеш-промахи.
- Серверные задержки. Высокий TTFB, перегруженные API.
- Неоптимизированные медиа. Большие изображения, отсутствие lazy loading, неправильные форматы.
Почему это критично для AI Visibility
[править]В контексте GEO и AI-поиска, если контент не загружается быстро как «чистый HTML», он может не попасть в RAG-выборку. Это означает, что страница может индексироваться, но не использоваться в ответах LLM.
Resource Timing API - это 1 из базовых источников данных для индекса отзывчивости. Он влияет на скорость ответа сайта, доступность для AI-ботов и качество извлечения контента.
Связь с RAG-системами
[править]RAG (Retrieval-Augmented Generation) зависит от скорости извлечения HTML, доступа к тексту и отсутствия JS-блокировок. Если Resource Timing показывает задержки, это напрямую снижает шанс попадания в retrieval-слой.
Как использовать данные на практике
[править]- Найти медленные ресурсы. Сортировка по duration и transferSize.
- Убрать блокирующие скрипты. Перенос в async / defer.
- Оптимизировать изображения. WebP, AVIF, lazy loading.
- Снизить нагрузку сторонних сервисов. Аудит всех подключённых скриптов.
Инструменты для анализа AI-видимости
[править]В связке с техническим анализом скорости и AI-доступности используется AI Presence. Он помогает понять не только скорость загрузки, но и попадает ли сайт в AI-ответы, используется ли в RAG-выборке и стабильно ли извлекается контент.
Итог
[править]Resource Timing API - это инструмент, который показывает реальную «физику скорости» сайта. Не среднюю оценку и не маркетинговый балл, а фактическую картину того, как пользователь и браузер получают каждый байт вашего сайта. В интернет-маркетинге это критично: вы не можете улучшить то, что не измеряете на уровне причин.
