Document : évènement prerenderingchange

Limited availability

Cette fonctionnalité n'est pas Compatible car elle ne fonctionne pas dans certains des navigateurs les plus utilisés.

Expérimental:Il s'agit d'unetechnologie expérimentale.
Vérifiez attentivement letableau de compatibilité des navigateurs avant de l'utiliser en production.

L'évènementprerenderingchange est déclenché sur un document pré-rendu lorsqu'il est activé (c'est-à-dire lorsque l'utilisateur·ice consulte la page).

Syntaxe

Utilisez le nom de l'évènement dans des méthodes commeaddEventListener(), ou définissez une propriété de gestionnaire d'évènement.

addEventListener("prerenderingchange", (event) => { })onprerenderingchange = (event) => { }

Cet exemple montre comment différer du code qui s'exécuterait normalement pendant le pré-rendu, jusqu'après l'activation de la page.C'est utile pour différer le code d'analyse, qui n'est pertinent que lorsque la page est effectivement consultée.

Le code vérifie si le pré-rendu est en cours viaDocument.prerendering et, le cas échéant, ajoute un gestionnaire d'évènement pour exécuter une fonction d'initialisation analytique une fois la page activée.Sur une page qui n'est pas en pré-rendu, le code d'analyse s'exécute immédiatement.

if (document.prerendering) {  document.addEventListener("prerenderingchange", initAnalytics, {    once: true,  });} else {  initAnalytics();}

Notez que ce type de code ne doit pas être utilisé pour mesurer la fréquence d'activation d'un pré-rendu, car le code peut s'exécuter après que la page pré-rendue a déjà été activée.

Note :Voir la page d'accueil de l'API Speculation Rules et en particulier la sectionConditions de chargement spéculatif non sûr pour plus d'informations sur les types d'activités que vous pourriez vouloir différer jusqu'à la fin du pré-rendu.

Mesurer les activations de pré-rendu

Ce code montre comment mesurer la fréquence d'activation d'un pré-rendu.Il utilise l'évènementprerenderingchange pour suivre les activations, etPerformance.getEntriesByType() pour suivre les activations de navigation.

if (document.prerendering) {  document.addEventListener(    "prerenderingchange",    () => {      console.log("Pré-rendu activé après l'exécution de ce script");    },    { once: true },  );} else if (performance.getEntriesByType("navigation")[0]?.activationStart > 0) {  console.log("Pré-rendu activé avant l'exécution de ce script");} else {  console.log("Ce chargement de page ne s'est pas fait via un pré-rendu");}