aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/api/performance_timeline
diff options
context:
space:
mode:
authorjulieng <julien.gattelier@gmail.com>2021-10-02 17:20:24 +0200
committerSphinxKnight <SphinxKnight@users.noreply.github.com>2021-10-02 17:30:20 +0200
commit1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde (patch)
tree30a56efd3eff3a01bd1611e1840fdbbfacf544a4 /files/fr/web/api/performance_timeline
parentc05efa8d7ae464235cf83d7c0956e42dc6974103 (diff)
downloadtranslated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.gz
translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.bz2
translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.zip
convert content to md
Diffstat (limited to 'files/fr/web/api/performance_timeline')
-rw-r--r--files/fr/web/api/performance_timeline/index.md86
-rw-r--r--files/fr/web/api/performance_timeline/using_performance_timeline/index.md115
2 files changed, 86 insertions, 115 deletions
diff --git a/files/fr/web/api/performance_timeline/index.md b/files/fr/web/api/performance_timeline/index.md
index db39bbf9bd..3bfdfee43d 100644
--- a/files/fr/web/api/performance_timeline/index.md
+++ b/files/fr/web/api/performance_timeline/index.md
@@ -11,74 +11,64 @@ tags:
- Web Performance
translation_of: Web/API/Performance_Timeline
---
-<div>{{DefaultAPISidebar("Performance Timeline API")}}</div>
+{{DefaultAPISidebar("Performance Timeline API")}}
-<p>L'API <strong>Performance Timeline</strong> définit des extensions de l'interface <a href="/fr/docs/Web/API/Performance"><code>Performance</code></a> pour prendre en charge les mesures de latence côté client dans les applications. Ces extensions fournissent des interfaces permettant de récupérer les <a href="/fr/docs/Web/API/PerformanceEntry">paramètres de saisie des performances</a> en fonction de critères de filtrage spécifiques.</p>
+L'API **Performance Timeline** définit des extensions de l'interface [`Performance`](/fr/docs/Web/API/Performance) pour prendre en charge les mesures de latence côté client dans les applications. Ces extensions fournissent des interfaces permettant de récupérer les [paramètres de saisie des performances](/fr/docs/Web/API/PerformanceEntry) en fonction de critères de filtrage spécifiques.
-<p>La norme comprend également des interfaces qui permettent à une application de définir des retours (« callbacks ») d'<em><a href="#performance_observers">observateur des performances</a></em>, qui sont notifiés lorsque des événements de performance spécifiques sont ajoutés à la <em>chronologie des performances</em> du navigateur.</p>
+La norme comprend également des interfaces qui permettent à une application de définir des retours (« callbacks ») d'_[observateur des performances](#performance_observers)_, qui sont notifiés lorsque des événements de performance spécifiques sont ajoutés à la _chronologie des performances_ du navigateur.
-<p>Ce document fournit un aperçu des interfaces de la norme. Pour plus de détails sur les interfaces, voir les pages de référence et <a href="/fr/docs/Web/API/Performance_Timeline/Using_Performance_Timeline">Utilisation de Performance Timeline</a>.</p>
+Ce document fournit un aperçu des interfaces de la norme. Pour plus de détails sur les interfaces, voir les pages de référence et [Utilisation de Performance Timeline](/fr/docs/Web/API/Performance_Timeline/Using_Performance_Timeline).
-<p>{{AvailableInWorkers}}</p>
+{{AvailableInWorkers}}
-<h2 id="Performance_extensions">Extensions de <code>Performance</code></h2>
+## Extensions de `Performance`
-<p>L'API Performance Timeline étend l'interface <a href="/fr/docs/Web/API/Performance"><code>Performance</code></a> avec trois méthodes qui fournissent différents mécanismes pour obtenir un ensemble d'<a href="/fr/docs/Web/API/PerformanceEntry">enregistrements des performances (métriques)</a>, en fonction des critères de filtrage spécifiés. Ces méthodes sont les suivantes :</p>
+L'API Performance Timeline étend l'interface [`Performance`](/fr/docs/Web/API/Performance) avec trois méthodes qui fournissent différents mécanismes pour obtenir un ensemble d'[enregistrements des performances (métriques)](/fr/docs/Web/API/PerformanceEntry), en fonction des critères de filtrage spécifiés. Ces méthodes sont les suivantes :
-<dl>
- <dt><a href="/fr/docs/Web/API/Performance/getEntries"><code>getEntries()</code></a></dt>
- <dd>Renvoie toutes les <a href="/fr/docs/Web/API/PerformanceEntry">entrées de performances</a> enregistrées ou, éventuellement, les entrées basées sur les <a href="/fr/docs/Web/API/PerformanceEntry/name"><code>name</code></a>, <a href="/fr/docs/Web/API/PerformanceEntry">type de performance</a> et/ou les <a href="/fr/docs/Web/API/PerformanceResourceTiming/initiatorType"><code>initiatorType</code></a> spécifiés. (tel qu'un élément HTML).</dd>
- <dt><a href="/fr/docs/Web/API/Performance/getEntriesByName"><code>getEntriesByName()</code></a></dt>
- <dd>Renvoie les <a href="/fr/docs/Web/API/PerformanceEntry">entrées de performances</a> enregistrées en fonction du <a href="/fr/docs/Web/API/PerformanceEntry/name"><code>name</code></a> spécifié et éventuellement du <a href="/fr/docs/Web/API/PerformanceEntry">type de performance</a>.</dd>
- <dt><a href="/fr/docs/Web/API/Performance/getEntriesByType"><code>getEntriesByType()</code></a></dt>
- <dd>Renvoie les <a href="/fr/docs/Web/API/PerformanceEntry">entrées de perfornances</a> enregistrées en fonction des <a href="/fr/docs/Web/API/PerformanceEntry">types de performances</a> spécifiés.</dd>
-</dl>
+- [`getEntries()`](/fr/docs/Web/API/Performance/getEntries)
+ - : Renvoie toutes les [entrées de performances](/fr/docs/Web/API/PerformanceEntry) enregistrées ou, éventuellement, les entrées basées sur les [`name`](/fr/docs/Web/API/PerformanceEntry/name), [type de performance](/fr/docs/Web/API/PerformanceEntry) et/ou les [`initiatorType`](/fr/docs/Web/API/PerformanceResourceTiming/initiatorType) spécifiés. (tel qu'un élément HTML).
+- [`getEntriesByName()`](/fr/docs/Web/API/Performance/getEntriesByName)
+ - : Renvoie les [entrées de performances](/fr/docs/Web/API/PerformanceEntry) enregistrées en fonction du [`name`](/fr/docs/Web/API/PerformanceEntry/name) spécifié et éventuellement du [type de performance](/fr/docs/Web/API/PerformanceEntry).
+- [`getEntriesByType()`](/fr/docs/Web/API/Performance/getEntriesByType)
+ - : Renvoie les [entrées de perfornances](/fr/docs/Web/API/PerformanceEntry) enregistrées en fonction des [types de performances](/fr/docs/Web/API/PerformanceEntry) spécifiés.
-<h2 id="PerformanceEntry_interface">L'interface <code>PerformanceEntry</code></h2>
+## L'interface `PerformanceEntry`
-<p>L'interface <a href="/fr/docs/Web/API/PerformanceEntry"><code>PerformanceEntry</code></a> encapsule une unique <em>entrée de performance</em>, c'est-à-dire un point de donnée ou une métrique située sur <em>la chronologie des performances</em>. Cette interface possède quatre propriétés ; ces propriétés sont étendues (avec des contraintes supplémentaires) par d'autres interfaces (telles que <a href="/fr/docs/Web/API/PerformanceMark"><code>PerformanceMark</code></a>) :</p>
+L'interface [`PerformanceEntry`](/fr/docs/Web/API/PerformanceEntry) encapsule une unique _entrée de performance_, c'est-à-dire un point de donnée ou une métrique située sur _la chronologie des performances_. Cette interface possède quatre propriétés ; ces propriétés sont étendues (avec des contraintes supplémentaires) par d'autres interfaces (telles que [`PerformanceMark`](/fr/docs/Web/API/PerformanceMark)) :
-<dl>
- <dt><a href="/fr/docs/Web/API/PerformanceEntry/name"><code>name</code></a></dt>
- <dd>Le nom de l'entrée de performance lorsque la métrique a été créée.</dd>
- <dt><a href="/fr/docs/Web/API/PerformanceEntry/entryType"><code>entryType</code></a></dt>
- <dd>Le type de mesure de performance (par exemple, « <code>mark</code> »).</dd>
- <dt><a href="/fr/docs/Web/API/PerformanceEntry/startTime"><code>startTime</code></a></dt>
- <dd>Un <a href="/fr/docs/Web/API/DOMHighResTimeStamp">horodatage haute résolution</a> représentant l'heure de départ de l'entrée de performance.</dd>
- <dt><a href="/fr/docs/Web/API/PerformanceEntry/duration"><code>duration</code></a></dt>
- <dd>Un <a href="/fr/docs/Web/API/DOMHighResTimeStamp">horodatage haute résolution</a> représentant la valeur temporelle de la durée de l'événement de performance (certains <a href="/fr/docs/Web/API/PerformanceEntry/entryType">types d'entrée</a> de performance n'ont pas de concept de <em>durée</em> et cette valeur est fixée à <code>'0'</code> pour ces types).</dd>
-</dl>
+- [`name`](/fr/docs/Web/API/PerformanceEntry/name)
+ - : Le nom de l'entrée de performance lorsque la métrique a été créée.
+- [`entryType`](/fr/docs/Web/API/PerformanceEntry/entryType)
+ - : Le type de mesure de performance (par exemple, « `mark` »).
+- [`startTime`](/fr/docs/Web/API/PerformanceEntry/startTime)
+ - : Un [horodatage haute résolution](/fr/docs/Web/API/DOMHighResTimeStamp) représentant l'heure de départ de l'entrée de performance.
+- [`duration`](/fr/docs/Web/API/PerformanceEntry/duration)
+ - : Un [horodatage haute résolution](/fr/docs/Web/API/DOMHighResTimeStamp) représentant la valeur temporelle de la durée de l'événement de performance (certains [types d'entrée](/fr/docs/Web/API/PerformanceEntry/entryType) de performance n'ont pas de concept de _durée_ et cette valeur est fixée à `'0'` pour ces types).
-<p>Cette interface comprend une méthode <a href="/fr/docs/Web/API/PerformanceEntry/toJSON"><code>toJSON()</code></a> qui renvoie la sérialisation de l'objet <a href="/fr/docs/Web/API/PerformanceEntry"><code>PerformanceEntry</code></a>. La sérialisation varie selon le <a href="/fr/docs/Web/API/PerformanceEntry/entryType">type de performance</a>.</p>
+Cette interface comprend une méthode [`toJSON()`](/fr/docs/Web/API/PerformanceEntry/toJSON) qui renvoie la sérialisation de l'objet [`PerformanceEntry`](/fr/docs/Web/API/PerformanceEntry). La sérialisation varie selon le [type de performance](/fr/docs/Web/API/PerformanceEntry/entryType).
-<h2 id="Performance_observers">Observateurs des performances</h2>
+## Observateurs des performances
-<p>{{SeeCompatTable}}</p>
+{{SeeCompatTable}}
-<p>Les interfaces d'<em>observateurs de performance</em> permettent à une application d'enregistrer un <em>observateur</em> pour des types d'événements de performance spécifiques. Lorsqu'un de ces types d'événements est enregistré, l'application est <em>notifiée</em> de l'événement via la fonction de rappel de l'observateur qui a été spécifiée lors de la création de l'observateur.</p>
+Les interfaces d'_observateurs de performance_ permettent à une application d'enregistrer un _observateur_ pour des types d'événements de performance spécifiques. Lorsqu'un de ces types d'événements est enregistré, l'application est _notifiée_ de l'événement via la fonction de rappel de l'observateur qui a été spécifiée lors de la création de l'observateur.
-<p>Lorsque la fonction de rappel de l'observateur (<i>callback</i>) est invoquée, les paramètres incluent une <em><a href="/fr/docs/Web/API/PerformanceObserverEntryList">liste des entrées de l'observateur de performance</a></em> qui contient uniquement des <a href="/fr/docs/Web/API/PerformanceEntry">entrées de performance</a> <em>observées</em>. C'est-à-dire que la liste contient uniquement des entrées pour les types d'événements qui ont été spécifiés lorsque la méthode <a href="/fr/docs/Web/API/PerformanceObserver/observe"><code>observe()</code></a> de l'observateur a été invoquée. L'interface <a href="/fr/docs/Web/API/PerformanceObserverEntryList"><code>PerformanceObserverEntryList</code></a> possède les trois mêmes méthodes <code>getEntries*()</code> que l'interface <a href="/fr/docs/Web/API/Performance"><code>Performance</code></a>. Cependant, notez qu'il y a une différence clé avec ces méthodes ; les versions <a href="/fr/docs/Web/API/PerformanceObserverEntryList"><code>PerformanceObserverEntryList</code></a> sont utilisées pour récupérer les entrées de performance <em>observées</em> dans le rappel de l'observateur.</p>
+Lorsque la fonction de rappel de l'observateur (_callback_) est invoquée, les paramètres incluent une _[liste des entrées de l'observateur de performance](/fr/docs/Web/API/PerformanceObserverEntryList)_ qui contient uniquement des [entrées de performance](/fr/docs/Web/API/PerformanceEntry) _observées_. C'est-à-dire que la liste contient uniquement des entrées pour les types d'événements qui ont été spécifiés lorsque la méthode [`observe()`](/fr/docs/Web/API/PerformanceObserver/observe) de l'observateur a été invoquée. L'interface [`PerformanceObserverEntryList`](/fr/docs/Web/API/PerformanceObserverEntryList) possède les trois mêmes méthodes `getEntries*()` que l'interface [`Performance`](/fr/docs/Web/API/Performance). Cependant, notez qu'il y a une différence clé avec ces méthodes ; les versions [`PerformanceObserverEntryList`](/fr/docs/Web/API/PerformanceObserverEntryList) sont utilisées pour récupérer les entrées de performance _observées_ dans le rappel de l'observateur.
-<p>Outre la méthode <a href="/fr/docs/Web/API/PerformanceObserver/observe"><code>observe()</code></a> de l'interface <a href="/fr/docs/Web/API/PerformanceObserver"><code>PerformanceObserver</code></a> (qui sert à enregistrer les <a href="/fr/docs/Web/API/PerformanceEntry">types d'entrées</a> pour <em>observer</em>), l'interface <a href="/fr/docs/Web/API/PerformanceObserver"><code>PerformanceObserver</code></a> possède également une méthode <a href="/fr/docs/Web/API/PerformanceObserver/disconnect"><code>disconnect()</code></a> qui empêche un observateur de recevoir d'autres événements.</p>
+Outre la méthode [`observe()`](/fr/docs/Web/API/PerformanceObserver/observe) de l'interface [`PerformanceObserver`](/fr/docs/Web/API/PerformanceObserver) (qui sert à enregistrer les [types d'entrées](/fr/docs/Web/API/PerformanceEntry) pour _observer_), l'interface [`PerformanceObserver`](/fr/docs/Web/API/PerformanceObserver) possède également une méthode [`disconnect()`](/fr/docs/Web/API/PerformanceObserver/disconnect) qui empêche un observateur de recevoir d'autres événements.
-<div class="note">
- <p><strong>Note :</strong> Les observateurs de performance ont été ajoutés au <code>Niveau 2</code> de la norme et n'ont pas été implémentés à grande échelle.</p>
-</div>
+> **Note :** Les observateurs de performance ont été ajoutés au `Niveau 2` de la norme et n'ont pas été implémentés à grande échelle.
-<h2 id="Implementation_status">État de la mise en œuvre</h2>
+## État de la mise en œuvre
-<p>Un résumé de l'état de mise en œuvre des interfaces est fourni ci-dessous, avec un lien vers des informations plus détaillées.</p>
+Un résumé de l'état de mise en œuvre des interfaces est fourni ci-dessous, avec un lien vers des informations plus détaillées.
-<ul>
- <li><strong>Les extensions de l'interface <code>Performance</code> :</strong> Comme le montre le tableau de <a href="/fr/docs/Web/API/Performance#browser_compatibility">Compatibilité des navigateurs</a> de l'interface <a href="/fr/docs/Web/API/Performance"><code>Performance</code></a>, la plupart de ces interfaces sont largement prises en charge par les navigateurs de bureau et bénéficient d'un support moindre sur les appareils mobiles.</li>
- <li><strong><code>PerformanceEntry</code> :</strong> Comme le montre le tableau de <a href="/fr/docs/Web/API/PerformanceEntry#browser_compatibility">Compatibilité des navigateurs</a> de l'interface <a href="/fr/docs/Web/API/PerformanceEntry"><code>PerformanceEntry</code></a>, la plupart de ces interfaces sont largement prises en charge par les navigateurs de bureau et le sont moins sur les appareils mobiles.</li>
- <li><strong><code>PerformanceObserver</code> {{experimental_inline}} :</strong> Comme le montre le tableau de <a href="/fr/docs/Web/API/PerformanceObserver#browser_compatibility">Compatibilité des navigateurs</a> de l'interface <a href="/fr/docs/Web/API/PerformanceObserver"><code>PerformanceObserver</code></a>, cette interface n'est pas implémentée par les navigateurs.</li>
-</ul>
+- **Les extensions de l'interface `Performance` :** Comme le montre le tableau de [Compatibilité des navigateurs](/fr/docs/Web/API/Performance#browser_compatibility) de l'interface [`Performance`](/fr/docs/Web/API/Performance), la plupart de ces interfaces sont largement prises en charge par les navigateurs de bureau et bénéficient d'un support moindre sur les appareils mobiles.
+- **`PerformanceEntry` :** Comme le montre le tableau de [Compatibilité des navigateurs](/fr/docs/Web/API/PerformanceEntry#browser_compatibility) de l'interface [`PerformanceEntry`](/fr/docs/Web/API/PerformanceEntry), la plupart de ces interfaces sont largement prises en charge par les navigateurs de bureau et le sont moins sur les appareils mobiles.
+- **`PerformanceObserver` {{experimental_inline}} :** Comme le montre le tableau de [Compatibilité des navigateurs](/fr/docs/Web/API/PerformanceObserver#browser_compatibility) de l'interface [`PerformanceObserver`](/fr/docs/Web/API/PerformanceObserver), cette interface n'est pas implémentée par les navigateurs.
-<p>Pour tester la prise en charge de ces interfaces par votre navigateur, vous pouvez exécuter l'application <code><a href="https://mdn.github.io/web-performance/perf-api-support.html">perf-api-support</a></code>.</p>
+Pour tester la prise en charge de ces interfaces par votre navigateur, vous pouvez exécuter l'application [`perf-api-support`](https://mdn.github.io/web-performance/perf-api-support.html).
-<h2 id="See_also">Voir aussi</h2>
+## Voir aussi
-<ul>
- <li><a href="https://siusin.github.io/perf-timing-primer/">Une introduction aux API de chronométrage des performances du Web</a> <small>(en)</small></li>
-</ul>
+- [Une introduction aux API de chronométrage des performances du Web](https://siusin.github.io/perf-timing-primer/) (en)
diff --git a/files/fr/web/api/performance_timeline/using_performance_timeline/index.md b/files/fr/web/api/performance_timeline/using_performance_timeline/index.md
index c3554f1927..c6307ae61a 100644
--- a/files/fr/web/api/performance_timeline/using_performance_timeline/index.md
+++ b/files/fr/web/api/performance_timeline/using_performance_timeline/index.md
@@ -8,23 +8,23 @@ tags:
- Web Performance
translation_of: Web/API/Performance_Timeline/Using_Performance_Timeline
---
-<div>{{DefaultAPISidebar("Performance Timeline API")}}</div>
+{{DefaultAPISidebar("Performance Timeline API")}}
-<p>La norme <strong><a href="https://w3c.github.io/performance-timeline/">Performance Timeline</a></strong> définit des extensions de l'interface <a href="/fr/docs/Web/API/Performance"><code>Performance</code></a> pour prendre en charge les mesures de latence côté client au sein des applications.</p>
+La norme **[Performance Timeline](https://w3c.github.io/performance-timeline/)** définit des extensions de l'interface [`Performance`](/fr/docs/Web/API/Performance) pour prendre en charge les mesures de latence côté client au sein des applications.
-<p>La norme comprend également des interfaces qui permettent à une application d'être notifiée lorsque des événements de performance spécifiques se produisent. Ensemble, ces interfaces peuvent être utilisées pour aider à identifier les goulots d'étranglement des performances d'une application.</p>
+La norme comprend également des interfaces qui permettent à une application d'être notifiée lorsque des événements de performance spécifiques se produisent. Ensemble, ces interfaces peuvent être utilisées pour aider à identifier les goulots d'étranglement des performances d'une application.
-<h2 id="Performance_extensions">Extensions de <code>Performance</code></h2>
+## Extensions de `Performance`
-<p><strong>Performance Timeline</strong> étend l'objet <a href="/fr/docs/Web/API/Performance"><code>Performance</code></a> avec trois méthodes qui fournissent différents mécanismes pour obtenir un ensemble d'<a href="/fr/docs/Web/API/PerformanceEntry">enregistrements des performances (métriques)</a>, selon les critères de filtrage spécifiés. L'exemple suivant montre l'utilisation de ces méthodes <a href="/fr/docs/Web/API/Performance/getEntries"><code>getEntries()</code></a>, <a href="/fr/docs/Web/API/Performance/getEntriesByName"><code>getEntriesByName()</code></a> et <a href="/fr/docs/Web/API/Performance/getEntriesByType"><code>getEntriesByType()</code></a>.</p>
+**Performance Timeline** étend l'objet [`Performance`](/fr/docs/Web/API/Performance) avec trois méthodes qui fournissent différents mécanismes pour obtenir un ensemble d'[enregistrements des performances (métriques)](/fr/docs/Web/API/PerformanceEntry), selon les critères de filtrage spécifiés. L'exemple suivant montre l'utilisation de ces méthodes [`getEntries()`](/fr/docs/Web/API/Performance/getEntries), [`getEntriesByName()`](/fr/docs/Web/API/Performance/getEntriesByName) et [`getEntriesByType()`](/fr/docs/Web/API/Performance/getEntriesByType).
-<pre class="brush: js">
+```js
function log(s) {
let o = document.getElementsByTagName("output")[0];
- o.innerHTML += s + " &lt;br&gt;";
+ o.innerHTML += s + " <br>";
}
function do_work(n) {
- for (let i=0 ; i &lt; n; i++) {
+ for (let i=0 ; i < n; i++) {
let m = Math.random();
}
}
@@ -49,39 +49,39 @@ function print_PerformanceEntries() {
// Utilise getEntries() pour itérer toutes les entrées.
let p = performance.getEntries();
- for (let i=0; i &lt; p.length; i++) {
+ for (let i=0; i < p.length; i++) {
log("Toutes les entrées [" + i + "]");
print_perf_entry(p[i]);
}
// Utilise getEntries(name, entryType) pour obtenir des entrées spécifiques.
p = performance.getEntries({name : "Measure1", entryType: "measure"});
- for (let i=0; i &lt; p.length; i++) {
+ for (let i=0; i < p.length; i++) {
log("Begin et Measure [" + i + "]");
print_perf_entry(p[i]);
}
// Utilisez getEntriesByType() pour obtenir toutes les entrées "mark".
p = performance.getEntriesByType("mark");
- for (let i=0; i &lt; p.length; i++) {
+ for (let i=0; i < p.length; i++) {
log ("Mark seulement [" + i + "]");
print_perf_entry(p[i]);
}
// Utilise getEntriesByName() pour obtenir toutes les entrées "mark" nommées "Begin".
p = performance.getEntriesByName("Begin", "mark");
- for (let i=0; i &lt; p.length; i++) {
+ for (let i=0; i < p.length; i++) {
log ("Begin et Mark [" + i + "]");
print_perf_entry(p[i]);
}
}
-</pre>
+```
-<h2 id="PerformanceEntry_interface">L'interface <code>PerformanceEntry</code></h2>
+## L'interface `PerformanceEntry`
-<p>L'interface <a href="/fr/docs/Web/API/PerformanceEntry"><code>PerformanceEntry</code></a> encapsule une seule <em>entrée de performance</em>, c'est-à-dire une seule métrique de performance. Cette interface possède quatre propriétés et un <em>sérialiseur</em> JSON : (<a href="/fr/docs/Web/API/Performance/toJSON"><code>toJSON()</code></a>. L'exemple suivant montre l'utilisation de ces propriétés.</p>
+L'interface [`PerformanceEntry`](/fr/docs/Web/API/PerformanceEntry) encapsule une seule _entrée de performance_, c'est-à-dire une seule métrique de performance. Cette interface possède quatre propriétés et un _sérialiseur_ JSON : ([`toJSON()`](/fr/docs/Web/API/Performance/toJSON). L'exemple suivant montre l'utilisation de ces propriétés.
-<pre class="brush: js">
+```js
function print_PerformanceEntry(ev) {
let properties = ["name", "entryType", "startTime", "duration"];
@@ -92,9 +92,9 @@ function print_PerformanceEntry(ev) {
performance.measure("measure-1");
let p = performance.getEntries();
- for (let i=0; i &lt; p.length; i++) {
+ for (let i=0; i < p.length; i++) {
log("PerfEntry[" + i + "]");
- for (let =0; j &lt; properties.length; j++) {
+ for (let =0; j < properties.length; j++) {
// check each property in window.performance
let supported = properties[j] in p[i];
if (supported) {
@@ -106,11 +106,11 @@ function print_PerformanceEntry(ev) {
}
}
}
-</pre>
+```
-<p>Cette interface comprend également une méthode <a href="/fr/docs/Web/API/PerformanceEntry/toJSON"><code>toJSON()</code></a> qui renvoie la sérialisation de l'objet <a href="/fr/docs/Web/API/PerformanceEntry"><code>PerformanceEntry</code></a>. Les exemples suivants montrent l'utilisation de cette méthode.</p>
+Cette interface comprend également une méthode [`toJSON()`](/fr/docs/Web/API/PerformanceEntry/toJSON) qui renvoie la sérialisation de l'objet [`PerformanceEntry`](/fr/docs/Web/API/PerformanceEntry). Les exemples suivants montrent l'utilisation de cette méthode.
-<pre class="brush: js">
+```js
function PerfEntry_toJSON() {
// Crée quelques entrées de performance
@@ -131,17 +131,17 @@ function PerfEntry_toJSON() {
let s = JSON.stringify(json);
log("PerformanceEntry.toJSON = " + s);
}
-</pre>
+```
-<h2 id="Performance_Observers">Observateurs de performance</h2>
+## Observateurs de performance
-<p>{{SeeCompatTable}}</p>
+{{SeeCompatTable}}
-<p>Les interfaces <em>Performance Observer</em> permettent à une application d'enregistrer un <em>observateur</em> pour des types d'événements de performance spécifiques, et lorsqu'un de ces types d'événements est enregistré, l'application est <em>notifiée</em> de l'événement via la fonction de rappel de l'observateur qui a été spécifiée au moment, où l'observateur a été créé. Lorsque l'observateur (rappel ou « callback ») est invoqué, les paramètres du rappel incluent une <em><a href="/fr/docs/Web/API/PerformanceObserverEntryList">liste d'entrées de l'observateur de performance</a></em> qui contient uniquement des <a href="/fr/docs/Web/API/PerformanceEntry">entrées de performance</a> <em>observées</em>. C'est-à-dire que la liste ne contient que des entrées pour les types d'événements qui ont été spécifiés lorsque la méthode <a href="/fr/docs/Web/API/PerformanceObserver/observe"><code>observe()</code></a> de l'observateur a été invoquée.</p>
+Les interfaces _Performance Observer_ permettent à une application d'enregistrer un _observateur_ pour des types d'événements de performance spécifiques, et lorsqu'un de ces types d'événements est enregistré, l'application est _notifiée_ de l'événement via la fonction de rappel de l'observateur qui a été spécifiée au moment, où l'observateur a été créé. Lorsque l'observateur (rappel ou « callback ») est invoqué, les paramètres du rappel incluent une _[liste d'entrées de l'observateur de performance](/fr/docs/Web/API/PerformanceObserverEntryList)_ qui contient uniquement des [entrées de performance](/fr/docs/Web/API/PerformanceEntry) _observées_. C'est-à-dire que la liste ne contient que des entrées pour les types d'événements qui ont été spécifiés lorsque la méthode [`observe()`](/fr/docs/Web/API/PerformanceObserver/observe) de l'observateur a été invoquée.
-<p>L'exemple suivant montre comment enregistrer deux observateurs : le premier s'enregistre pour plusieurs types d'événements et le second ne s'enregistre que pour un seul type d'événement.</p>
+L'exemple suivant montre comment enregistrer deux observateurs : le premier s'enregistre pour plusieurs types d'événements et le second ne s'enregistre que pour un seul type d'événement.
-<pre class="brush: js">
+```js
function PerformanceObservers() {
// Crée un observateur pour tous les types d'événements de performance
let observe_all = new PerformanceObserver(function(list, obs) {
@@ -149,19 +149,19 @@ function PerformanceObservers() {
// Imprime toutes les entrées
perfEntries = list.getEntries();
- for (let i=0; i &lt; perfEntries.length; i++) {
+ for (let i=0; i < perfEntries.length; i++) {
print_perf_entry(perfEntries[i]);
}
// Imprime les entrées nommées "Begin" avec le type "mark".
perfEntries = list.getEntriesByName("Begin", "mark");
- for (let i=0; i &lt; perfEntries.length; i++) {
+ for (let i=0; i < perfEntries.length; i++) {
print_perf_entry(perfEntries[i]);
}
// Imprime les entrées avec le type "mark".
perfEntries = list.getEntriesByType("mark");
- for (let i=0; i &lt; perfEntries.length; i++) {
+ for (let i=0; i < perfEntries.length; i++) {
print_perf_entry(perfEntries[i]);
}
});
@@ -172,7 +172,7 @@ function PerformanceObservers() {
let observe_mark = new PerformanceObserver(function(list, obs) {
let perfEntries = list.getEntries();
// Ne devrait avoir que des entrées de type "mark".
- for (let i=0; i &lt; perfEntries.length; i++) {
+ for (let i=0; i < perfEntries.length; i++) {
print_perf_entry(perfEntries[i]);
}
});
@@ -185,39 +185,20 @@ function print_perf_entry(pe) {
"; startTime: " + pe.startTime +
"; duration: " + pe.duration);
}
-</pre>
-
-<p>L'interface <a href="/fr/docs/Web/API/PerformanceObserverEntryList">liste des entrées de l'observateur de performance</a> possède les trois mêmes méthodes <code>getEntries*()</code> que l'interface <a href="/fr/docs/Web/API/Performance"><code>Performance</code></a> et ces méthodes sont utilisées pour récupérer les entrées de performance <em>observées</em> dans le rappel de l'observateur. Ces méthodes ont été utilisées dans l'exemple cité ci-dessus.</p>
-
-<h2 id="Specifications">Spécifications</h2>
-
-<p>Les interfaces décrites dans ce document sont définies dans la norme <strong>Performance Timeline</strong> qui comporte deux niveaux :</p>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Spécification</th>
- <th scope="col">Statut</th>
- <th scope="col">Commentaire</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{SpecName('Performance Timeline', '#extensions-to-the-performance-interface', 'Performance extensions')}}</td>
- <td>{{Spec2('Performance Timeline')}}</td>
- <td>Définition des méthodes <code>getEntries()</code>, <code>getEntriesByType()</code> et <code>getEntriesByName()</code>.</td>
- </tr>
- <tr>
- <td>{{SpecName('Performance Timeline Level 2', '#extensions-to-the-performance-interface', 'Performance extensions')}}</td>
- <td>{{Spec2('Performance Timeline Level 2')}}</td>
- <td>Modifications de l'interface <code>getEntries()</code>.</td>
- </tr>
- </tbody>
- </table>
-
-<h2 id="See_also">Voir aussi</h2>
-
-<ul>
- <li><a href="/fr/docs/Web/API/Performance_Timeline">Performance Timeline API</a></li>
- <li><a href="https://siusin.github.io/perf-timing-primer/">Une introduction aux API de chronométrage des performances du Web</a></li>
-</ul>
+```
+
+L'interface [liste des entrées de l'observateur de performance](/fr/docs/Web/API/PerformanceObserverEntryList) possède les trois mêmes méthodes `getEntries*()` que l'interface [`Performance`](/fr/docs/Web/API/Performance) et ces méthodes sont utilisées pour récupérer les entrées de performance _observées_ dans le rappel de l'observateur. Ces méthodes ont été utilisées dans l'exemple cité ci-dessus.
+
+## Spécifications
+
+Les interfaces décrites dans ce document sont définies dans la norme **Performance Timeline** qui comporte deux niveaux :
+
+| Spécification | Statut | Commentaire |
+| ------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------- | ------------------------------------------------------------------------------------- |
+| {{SpecName('Performance Timeline', '#extensions-to-the-performance-interface', 'Performance extensions')}} | {{Spec2('Performance Timeline')}} | Définition des méthodes `getEntries()`, `getEntriesByType()` et `getEntriesByName()`. |
+| {{SpecName('Performance Timeline Level 2', '#extensions-to-the-performance-interface', 'Performance extensions')}} | {{Spec2('Performance Timeline Level 2')}} | Modifications de l'interface `getEntries()`. |
+
+## Voir aussi
+
+- [Performance Timeline API](/fr/docs/Web/API/Performance_Timeline)
+- [Une introduction aux API de chronométrage des performances du Web](https://siusin.github.io/perf-timing-primer/)