Отслеживание пользовательского времени с помощью gtag.js

Сокращение времени загрузки страниц улучшает общее впечатление от сайта. В этой статье описывается, как отправлять в Google Аналитику информацию о пользовательском времени.

Реализация

Чтобы отправить данные о событии timing_complete, используйте команду event:

gtag('event', 'timing_complete', {<timing_parameters>});

В качестве <timing_parameters> необходимо указать одну или несколько пар "параметр-значение", разделяя их запятыми. Например, приведенная ниже команда отправляет в Google Аналитику событие типа "Пользовательское время" и указывает, что на загрузку всех внешних зависимостей JavaScript ушло 3549 миллисекунд.

gtag('event', 'timing_complete', {
  'name' : 'load',
  'value' : 3549,
  'event_category' : 'JS Dependencies'
});

Параметры пользовательского времени

В приведенной ниже таблице перечислены параметры пользовательского времени.

Параметр Тип данных Обязательно? Описание
name string Да Строка, которая используется для идентификации записываемой переменной. Пример: 'load'.
value integer Да Истекшее время в миллисекундах, которое регистрируется в Google Аналитике. Пример: 20.
event_category string Нет Строка для распределения всех переменных пользовательского времени по логическим группам. Пример: 'JS Dependencies'.
event_label string Нет Строка, которую можно использовать для более гибкой визуализации времени в отчетах. Пример: 'Google CDN'.

Измерение времени

Для события timing_complete нужно указать время в миллисекундах в параметре value. Вы должны написать код для его расчета самостоятельно.

Самый простой способ – создать временные отметки в начале и в конце периода, а зачем вычислить разность между второй и первой.

Большинство современных браузеров поддерживают Navigation Timing API, в котором для точного измерения времени загрузки страниц используются методы объекта window.performance.

В примере ниже показано, как использовать метод performance.now(), который возвращает время, прошедшее с момента начала загрузки страницы.

// Feature detects Navigation Timing API support.
if (window.performance) {
  // Gets the number of milliseconds since page load
  // (and rounds the result since the value must be an integer).
  var timeSincePageLoad = Math.round(performance.now());

  // Sends the timing event to Google Analytics.
  gtag('event', 'timing_complete', {
    'name': 'load',
    'value': timeSincePageLoad,
    'event_category': 'JS Dependencies'
  });
}

Выборки

Google Аналитика создает выборки обращений по времени, чтобы обеспечить равномерное распределение системных ресурсов.

Коэффициент выборки зависит от общего числа просмотров страниц для ресурса за предыдущий день (см. таблицу ниже).

Общее количество просмотров страницы (предыдущий день) Максимальный размер выборки (сколько просмотров будет обработано)
0–1000 100
1000–100 000 10 % от общего количества просмотров страницы
100 000–1 000 000 10 000
Более 1 000 000 1 % от общего количества просмотров страницы