La réduction du temps de chargement des pages peut améliorer l'expérience utilisateur globale d'un site. Cette page explique comment envoyer des informations sur le temps utilisateur à Google Analytics.
Implémentation
Utilisez la commande event pour envoyer un événement timing_complete:
gtag('event', 'timing_complete', {<timing_parameters>});
où <timing_parameters> correspond à une ou plusieurs paires paramètre/valeur. Séparez chaque paire par une virgule. Par exemple, cette commande envoie un événement de temps utilisateur à Google Analytics, indiquant que 3 549 millisecondes ont été nécessaires pour que la page Web actuelle charge toutes les dépendances JavaScript externes.
gtag('event', 'timing_complete', {
'name' : 'load',
'value' : 3549,
'event_category' : 'JS Dependencies'
});
Paramètres de la durée utilisateur
Ce tableau récapitule les paramètres de temps utilisateur:
| Nom du paramètre | Type de données | Obligatoire | Description |
|---|---|---|---|
name |
string |
Yes |
Chaîne permettant d'identifier la variable enregistrée (par exemple, 'load').
|
value |
integer |
Yes |
Nombre de millisecondes écoulées pour créer un rapport à Google Analytics (par exemple, 20).
|
event_category |
string |
No |
Chaîne permettant de catégoriser toutes les variables de temps utilisateur en groupes logiques (par exemple, 'JS Dependencies').
|
event_label |
string |
Non |
Chaîne permettant de visualiser plus facilement le temps utilisateur dans les rapports (par exemple, 'Google CDN').
|
Mesure du temps
L'événement timing_complete nécessite un paramètre value qui spécifie le temps écoulé en millisecondes. Vous devez écrire du code qui capture cette valeur.
Pour ce faire, le moyen le plus simple consiste à créer un code temporel au début d'une période et à créer un autre code temporel à la fin de celle-ci. Calculez ensuite le temps écoulé entre les horodatages.
La plupart des navigateurs récents sont compatibles avec l'API Navigation Timing, qui inclut des méthodes sur l'objet window.performance pour mesurer les performances des pages Web grâce à des données temporelles haute résolution.
L'exemple suivant utilise la méthode performance.now(), qui renvoie le temps écoulé depuis le premier chargement de la page:
// 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'
});
}
Remarques concernant l'échantillonnage
Google Analytics échantillonne les événements temporels afin d'assurer une distribution équitable des ressources système pour cette fonctionnalité.
La fréquence d'échantillonnage des événements temporels est déterminée par le nombre total de pages vues reçues la veille pour la propriété. Le tableau suivant décrit comment le taux d'échantillonnage temporel est déterminé:
| Nombre total de pages vues (jour précédent) | Nombre maximal d'événements temporels qui seront traités |
|---|---|
| 0 – 1 000 | 100 |
| 1 000 – 100 000 | 10% du nombre total de pages vues |
| 100 000-1 000 000 | 10 000 |
| + de 1 000 000 | 1% du nombre total de pages vues |