Редиректы и их учёт в TTFB

Time to First Byte (TTFB) — это ключевой показатель веб-производительности, измеряющий время от момента запроса страницы до получения первого байта ответа от сервера. TTFB состоит из нескольких этапов: DNS lookup, установление TCP-соединения, TLS handshake (при HTTPS), и непосредственно время обработки запроса на сервере. Редиректы оказывают существенное влияние на TTFB, так как каждый перенаправляющий ответ добавляет задержку в цепочку запросов.


Механизм влияния редиректов на TTFB

Каждый HTTP-редирект (например, 301 или 302) инициирует новый цикл запроса:

  1. Первичный запрос отправляется на исходный URL.
  2. Сервер отвечает кодом редиректа с указанием нового Location.
  3. Браузер начинает новый запрос на указанный URL.
  4. TTFB для исходного запроса включает только время до получения первого байта ответа с кодом редиректа.
  5. Последующие запросы увеличивают суммарное время до первого байта окончательного контента.

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


Учёт редиректов в Web Vitals

Библиотека Web Vitals предоставляет API для измерения показателей производительности, включая TTFB через метрику serverTiming. Стандартные события, такие как PerformanceNavigationTiming и PerformanceResourceTiming, позволяют получить детальные данные по каждому шагу запроса.

Пример использования с учётом редиректов:

import { getTTFB } from 'web-vitals';

getTTFB((metric) => {
  console.log('TTFB:', metric.value);
  console.log('Запрос прошёл редиректы:', metric.entries[0].redirectStart, metric.entries[0].redirectEnd);
});

Ключевые моменты:

  • redirectStart и redirectEnd — времена начала и конца всех редиректов.
  • metric.value — чистый TTFB без учёта последующих редиректов, но с учётом задержек на сервере.
  • Для анализа полной цепочки редиректов необходимо обрабатывать массив entries и суммировать интервалы redirectEnd - redirectStart для каждого перенаправления.

Практическая интерпретация данных

  1. Один редирект: добавляет в среднем 100–300 мс к TTFB в зависимости от географического положения сервера и скорости сети.
  2. Несколько редиректов: суммируются линейно, что может удлинить время до загрузки страницы на секунды.
  3. Серверные оптимизации: сокращение числа редиректов или использование server-side rewrite вместо HTTP-редиректа позволяет значительно уменьшить TTFB.

Влияние на SEO и Core Web Vitals

Google учитывает TTFB как компонент Largest Contentful Paint (LCP). Длинные цепочки редиректов напрямую увеличивают LCP, что ухудшает метрики Core Web Vitals. В аналитике Web Vitals важно разделять:

  • TTFB исходного запроса — время до первого байта ответа сервера с редиректом.
  • TTFB конечного ресурса — время до первого байта окончательного контента после всех редиректов.

Советы по измерению и визуализации

  • Использовать PerformanceObserver для отслеживания всех navigation и resource событий.
  • Логировать redirectStart и redirectEnd для каждой метрики.
  • Встраивать данные в диаграммы распределения TTFB, чтобы визуально идентифицировать узкие места из-за редиректов.
  • Проводить измерения с разных географических локаций, так как редиректы через сторонние CDN могут значительно увеличивать задержку.
const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    if (entry.entryType === 'navigation') {
      console.log('Redirects:', entry.redirectCount, 'Total Redirect Time:', entry.redirectEnd - entry.redirectStart);
      console.log('TTFB конечного ресурса:', entry.responseStart - entry.startTime);
    }
  });
});

observer.observe({ type: 'navigation', buffered: true });

Итоговая концепция

  • Редиректы не только увеличивают видимое время загрузки, но и напрямую влияют на TTFB.
  • Web Vitals позволяет тонко анализировать каждый шаг запроса, включая редиректы.
  • Сокращение числа редиректов и оптимизация серверной логики критичны для улучшения Core Web Vitals и ускорения отклика страниц.