From c05efa8d7ae464235cf83d7c0956e42dc6974103 Mon Sep 17 00:00:00 2001 From: julieng Date: Sat, 2 Oct 2021 17:20:14 +0200 Subject: move *.html to *.md --- files/fr/web/api/performanceeventtiming/index.html | 168 --------------------- files/fr/web/api/performanceeventtiming/index.md | 168 +++++++++++++++++++++ 2 files changed, 168 insertions(+), 168 deletions(-) delete mode 100644 files/fr/web/api/performanceeventtiming/index.html create mode 100644 files/fr/web/api/performanceeventtiming/index.md (limited to 'files/fr/web/api/performanceeventtiming') diff --git a/files/fr/web/api/performanceeventtiming/index.html b/files/fr/web/api/performanceeventtiming/index.html deleted file mode 100644 index 117fefc656..0000000000 --- a/files/fr/web/api/performanceeventtiming/index.html +++ /dev/null @@ -1,168 +0,0 @@ ---- -title: PerformanceEventTiming -slug: Web/API/PerformanceEventTiming -tags: - - API - - Event Timing API - - Interface - - Performance - - PerformanceEventTiming - - Reference - - Performance Web -translation_of: Web/API/PerformanceEventTiming ---- -
{{APIRef("Event Timing API")}}
- -

L'interface PerformanceEventTiming des événements de l'Event Timing API fournit des informations de chronométrage pour les types d'événements énumérés ci-dessous.

- - - -

Propriétés

- -
-
PerformanceEventTiming.processingStart lecture seule {{ExperimentalBadge}}
-
Retourne un DOMHighResTimeStamp représentant l'heure à laquelle la diffusion des événements a commencé.
-
PerformanceEventTiming.processingEnd lecture seule {{ExperimentalBadge}}
-
Retourne un DOMHighResTimeStamp représentant l'heure à laquelle la diffusion de l'événement s'est terminée.
-
PerformanceEventTiming.cancelable lecture seule {{ExperimentalBadge}}
-
Retourne un Boolean représentant l'attribut annulable de l'événement associé.
-
PerformanceEventTiming.target lecture seule {{NonStandardBadge}}
-
Retourne un Node représentant la dernière cible de l'événement associé, si elle n'est pas supprimée.
-
- -

Méthodes

- -
-
PerformanceEventTiming.toJSON() {{ExperimentalBadge}}
-
Convertit l'objet PerformanceEventTiming en JSON.
-
- -

Exemples

- -

L'exemple suivant montre comment utiliser l'API pour tous les événements :

- -
const observer = new PerformanceObserver(function(list) {
-  const perfEntries = list.getEntries().forEach(entry => {
-    // Durée totale
-    const inputDuration = entry.duration;
-    // Retard d'entrée (avant l'événement de traitement)
-    const inputDelay = entry.processingStart - entry.startTime;
-    // Temps de traitement d'un événement synchrone (entre le début et la fin de la diffusion).
-    const inputSyncProcessingTime = entry.processingEnd - entry.processingStart;
-  });
-});
-// Enregistre un observateur pour l'événement.
-observer.observe({entryTypes: ["event"]});
-
- -

Nous pouvons également interroger directement le premier délai d'entrée. Le premier délai d'entrée ou « FID : First input delay », mesure le temps entre le moment où un utilisateur interagit pour la première fois avec une page (c'est-à-dire lorsqu'il clique sur un lien ou sur un bouton) et le moment où le navigateur est effectivement en mesure de commencer à traiter les gestionnaires d'événements en réponse à cette interaction.

- -
// Pour savoir si (et quand) la page a été masquée pour la première fois, voir :
-// https://github.com/w3c/page-visibility/issues/29
-// NOTE : idéalement, cette vérification devrait être effectuée dans le <head> du document
-// pour éviter les cas où l'état de visibilité change avant l'exécution de ce code.
-let firstHiddenTime = document.visibilityState === 'hidden' ? 0 : Infinity;
-document.addEventListener('visibilitychange', (event) => {
-  firstHiddenTime = Math.min(firstHiddenTime, event.timeStamp);
-}, {once: true});
-
-// Envoie les données transmises à un point de terminaison analytique. Ce code
-// utilise `/analytics` ; vous pouvez le remplacer par votre propre URL.
-function sendToAnalytics(data) {
-  const body = JSON.stringify(data);
-  // Utilise `navigator.sendBeacon()` si disponible, en revenant à `fetch()`.
-  (navigator.sendBeacon && navigator.sendBeacon('/analytics', body)) ||
-      fetch('/analytics', {body, method: 'POST', keepalive: true});
-}
-
-// Utilise un try/catch au lieu de la fonction de détection de la prise en charge de `first-input`
-// car certains navigateurs lancent des requêtes lorsqu'ils utilisent la nouvelle option `type`.
-// https://bugs.webkit.org/show_bug.cgi?id=209216
-try {
-  function onFirstInputEntry(entry) {
-    // Ne rapporte le FID que si la page n'était pas cachée avant que
-    // l'entrée soit envoyée. Cela se produit généralement lorsqu'une
-    // page est chargée dans un onglet en arrière-plan.
-    if (entry.startTime < firstHiddenTime) {
-      const fid = entry.processingStart - entry.startTime;
-
-      // Rapporte la valeur du FID à un terminal d'analyse.
-      sendToAnalytics({fid});
-    }
-  }
-
-  // Crée un PerformanceObserver qui appelle `onFirstInputEntry` pour chaque entrée.
-  const po = new PerformanceObserver((entryList) => {
-    entryList.getEntries().forEach(onFirstInputEntry);
-  });
-
-  // Observe les entrées de type `first-input`, y compris les entrées en mémoire tampon,
-  // c'est-à-dire les entrées qui ont eu lieu avant d'appeler `observe()` ci-dessous.
-  po.observe({
-    type: 'first-input',
-    buffered: true,
-  });
-} catch (e) {
-  // Ne fait rien si le navigateur ne prend pas en charge cette API.
-}
-
- -

Spécifications

- - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Event Timing API','#sec-performance-event-timing','PerformanceEventTiming')}}{{Spec2('Event Timing API')}}Définition initiale.
- -

Compatibilité des navigateurs

- -

{{Compat("api.PerformanceEventTiming")}}

diff --git a/files/fr/web/api/performanceeventtiming/index.md b/files/fr/web/api/performanceeventtiming/index.md new file mode 100644 index 0000000000..117fefc656 --- /dev/null +++ b/files/fr/web/api/performanceeventtiming/index.md @@ -0,0 +1,168 @@ +--- +title: PerformanceEventTiming +slug: Web/API/PerformanceEventTiming +tags: + - API + - Event Timing API + - Interface + - Performance + - PerformanceEventTiming + - Reference + - Performance Web +translation_of: Web/API/PerformanceEventTiming +--- +
{{APIRef("Event Timing API")}}
+ +

L'interface PerformanceEventTiming des événements de l'Event Timing API fournit des informations de chronométrage pour les types d'événements énumérés ci-dessous.

+ + + +

Propriétés

+ +
+
PerformanceEventTiming.processingStart lecture seule {{ExperimentalBadge}}
+
Retourne un DOMHighResTimeStamp représentant l'heure à laquelle la diffusion des événements a commencé.
+
PerformanceEventTiming.processingEnd lecture seule {{ExperimentalBadge}}
+
Retourne un DOMHighResTimeStamp représentant l'heure à laquelle la diffusion de l'événement s'est terminée.
+
PerformanceEventTiming.cancelable lecture seule {{ExperimentalBadge}}
+
Retourne un Boolean représentant l'attribut annulable de l'événement associé.
+
PerformanceEventTiming.target lecture seule {{NonStandardBadge}}
+
Retourne un Node représentant la dernière cible de l'événement associé, si elle n'est pas supprimée.
+
+ +

Méthodes

+ +
+
PerformanceEventTiming.toJSON() {{ExperimentalBadge}}
+
Convertit l'objet PerformanceEventTiming en JSON.
+
+ +

Exemples

+ +

L'exemple suivant montre comment utiliser l'API pour tous les événements :

+ +
const observer = new PerformanceObserver(function(list) {
+  const perfEntries = list.getEntries().forEach(entry => {
+    // Durée totale
+    const inputDuration = entry.duration;
+    // Retard d'entrée (avant l'événement de traitement)
+    const inputDelay = entry.processingStart - entry.startTime;
+    // Temps de traitement d'un événement synchrone (entre le début et la fin de la diffusion).
+    const inputSyncProcessingTime = entry.processingEnd - entry.processingStart;
+  });
+});
+// Enregistre un observateur pour l'événement.
+observer.observe({entryTypes: ["event"]});
+
+ +

Nous pouvons également interroger directement le premier délai d'entrée. Le premier délai d'entrée ou « FID : First input delay », mesure le temps entre le moment où un utilisateur interagit pour la première fois avec une page (c'est-à-dire lorsqu'il clique sur un lien ou sur un bouton) et le moment où le navigateur est effectivement en mesure de commencer à traiter les gestionnaires d'événements en réponse à cette interaction.

+ +
// Pour savoir si (et quand) la page a été masquée pour la première fois, voir :
+// https://github.com/w3c/page-visibility/issues/29
+// NOTE : idéalement, cette vérification devrait être effectuée dans le <head> du document
+// pour éviter les cas où l'état de visibilité change avant l'exécution de ce code.
+let firstHiddenTime = document.visibilityState === 'hidden' ? 0 : Infinity;
+document.addEventListener('visibilitychange', (event) => {
+  firstHiddenTime = Math.min(firstHiddenTime, event.timeStamp);
+}, {once: true});
+
+// Envoie les données transmises à un point de terminaison analytique. Ce code
+// utilise `/analytics` ; vous pouvez le remplacer par votre propre URL.
+function sendToAnalytics(data) {
+  const body = JSON.stringify(data);
+  // Utilise `navigator.sendBeacon()` si disponible, en revenant à `fetch()`.
+  (navigator.sendBeacon && navigator.sendBeacon('/analytics', body)) ||
+      fetch('/analytics', {body, method: 'POST', keepalive: true});
+}
+
+// Utilise un try/catch au lieu de la fonction de détection de la prise en charge de `first-input`
+// car certains navigateurs lancent des requêtes lorsqu'ils utilisent la nouvelle option `type`.
+// https://bugs.webkit.org/show_bug.cgi?id=209216
+try {
+  function onFirstInputEntry(entry) {
+    // Ne rapporte le FID que si la page n'était pas cachée avant que
+    // l'entrée soit envoyée. Cela se produit généralement lorsqu'une
+    // page est chargée dans un onglet en arrière-plan.
+    if (entry.startTime < firstHiddenTime) {
+      const fid = entry.processingStart - entry.startTime;
+
+      // Rapporte la valeur du FID à un terminal d'analyse.
+      sendToAnalytics({fid});
+    }
+  }
+
+  // Crée un PerformanceObserver qui appelle `onFirstInputEntry` pour chaque entrée.
+  const po = new PerformanceObserver((entryList) => {
+    entryList.getEntries().forEach(onFirstInputEntry);
+  });
+
+  // Observe les entrées de type `first-input`, y compris les entrées en mémoire tampon,
+  // c'est-à-dire les entrées qui ont eu lieu avant d'appeler `observe()` ci-dessous.
+  po.observe({
+    type: 'first-input',
+    buffered: true,
+  });
+} catch (e) {
+  // Ne fait rien si le navigateur ne prend pas en charge cette API.
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Event Timing API','#sec-performance-event-timing','PerformanceEventTiming')}}{{Spec2('Event Timing API')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceEventTiming")}}

-- cgit v1.2.3-54-g00ecf