Поле id и уникальность сессии

В контексте библиотеки Web Vitals поле id является ключевым элементом для идентификации конкретного метрика или события, связанного с производительностью страницы. Оно обеспечивает точное отслеживание измерений и позволяет агрегировать данные без риска дублирования или путаницы между сессиями пользователей.

Структура поля id

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

Пример формата поля id:

"id": "v1-1678901234567-3f9a8b2c"

Компоненты:

  • v1 — версия протокола Web Vitals.
  • 1678901234567 — timestamp в миллисекундах, указывающий момент генерации метрики.
  • 3f9a8b2c — случайный или хешированный компонент, обеспечивающий уникальность в пределах сессии.

Уникальность сессии

Сессия пользователя определяется как последовательность действий на странице или сайте, объединяемая одним идентификатором сессии. В Web Vitals этот идентификатор используется для группировки метрик, связанных с конкретным визитом, и предотвращения смешивания данных разных пользователей.

Ключевые аспекты:

  1. Генерация уникального идентификатора Для каждой сессии создается новый sessionId. Он может быть основан на UUID версии 4, случайной строке или комбинации timestamp и случайного числа.

    Пример генерации в Jav * aScript:

    function generateSessionId() {
        return 'session-' + Date.now() + '-' + Math.floor(Math.random() * 1e8);
    }
    const sessionId = generateSessionId();
  2. Связывание метрик с сессией Каждое измерение Web Vitals (CLS, LCP, FID, TTFB) получает поле id и прикрепляется к sessionId. Это обеспечивает возможность анализа производительности по отдельным сессиям и выявление проблемных страниц или сценариев.

    import {getLCP} from 'web-vitals';
    
    getLCP((metric) => {
        const enrichedMetric = {
            ...metric,
            sessionId: sessionId
        };
        console.log(enrichedMetric);
    });
  3. Хранение и передача данных Метрики с привязанным sessionId можно отправлять на сервер аналитики для агрегирования, фильтрации и построения отчётов. Важно, чтобы id метрик оставался уникальным внутри одной сессии и не пересекался между пользователями.

  4. Обновление id при перезагрузке страницы В случае полной перезагрузки страницы создается новая сессия и, соответственно, новый id для метрик. Это предотвращает накопление старых данных в рамках новой сессии.

Практические рекомендации

  • Использовать проверенные методы генерации уникальных идентификаторов, такие как UUID или хеши на основе времени и случайного числа.
  • Сохранять sessionId в памяти или в sessionStorage, если нужно отслеживать несколько метрик на протяжении одной сессии:
let sessionId = sessionStorage.getItem('sessionId');
if (!sessionId) {
    sessionId = generateSessionId();
    sessionStorage.setItem('sessionId', sessionId);
}
  • Соблюдать уникальность id не только для аналитики, но и для корректной работы A/B тестов и систем мониторинга производительности.

Связь id и метрик Web Vitals

Каждая метрика Web Vitals (CLS, LCP, FID, TTFB, INP) сопровождается id, который позволяет:

  • Отслеживать отдельные события в рамках одной страницы.
  • Дифференцировать измерения между пользователями.
  • Объединять данные в отчётах по сессиям.
  • Исключать дублирование и искажения при агрегации.

Пример структуры метрики с id и sessionId:

{
  name: "LCP",
  value: 2500,
  id: "v1-1678901234567-3f9a8b2c",
  sessionId: "session-1678901200000-45238917",
  entries: [
      {startTime: 1000, duration: 500}
  ]
}

Такой подход обеспечивает точность аналитики и позволяет связывать производительность страницы с конкретными пользователями и сценариями их взаимодействия.