PerformancePaintTiming

L'interface PerformancePaintTiming de l'API Paint Timing API (en-US) fournit des informations de temps sur les opérations de « peinture » (également appelées « render ») pendant la construction de la page Web. « Paint » fait référence à la conversion de l'arbre de rendu en pixels à l'écran.

Une application peut enregistrer un PerformanceObserver pour le type d'entrée de performance « paint » et l'observateur peut récupérer les heures auxquelles les événements de peinture se produisent. Utilisez ces informations pour aider à identifier les zones qui prennent trop de temps pour offrir une bonne expérience utilisateur.

Propriétés

Cette interface n'a pas de propriétés mais elle étend les propriétés de PerformanceEntry suivantes (pour le type d'entrée de performance « paint ») en qualifiant/contraignant les propriétés comme suit :

PerformanceEntry.entryType: Retourne « paint ».
PerformanceEntry.name: Retourne soit "first-paint" ou "first-contentful-paint".
PerformanceEntry.startTime: Retourne le DOMHighResTimeStamp du moment où la peinture s'est produite.
PerformanceEntry.duration: Retourne « 0 ».

Méthodes

Cette interface n'a pas de méthodes.

Exemple

function showPaintTimings() {
  if (window.performance) {
    let performance = window.performance;
    let performanceEntries = performance.getEntriesByType("paint");
    performanceEntries.forEach((performanceEntry, i, entries) => {
      console.log(
        "Le temps pour " +
          performanceEntry.name +
          " est de " +
          performanceEntry.startTime +
          " millisecondes.",
      );
    });
  } else {
    console.log("Performance Timing n'est pas prise en charge.");
  }
}

Le code ci-dessus produit une sortie de console semblable à ce qui suit :

Le temps pour first-paint est de 2785.915 millisecondes.
Le temps pour first-contentful-paint est de 2787.460 millisecondes.

Spécifications

Specification
Paint Timing # sec-PerformancePaintTiming

Compatibilité des navigateurs

BCD tables only load in the browser