diff options
Diffstat (limited to 'files/fr/web/api/performanceelementtiming/loadtime/index.md')
-rw-r--r-- | files/fr/web/api/performanceelementtiming/loadtime/index.md | 60 |
1 files changed, 26 insertions, 34 deletions
diff --git a/files/fr/web/api/performanceelementtiming/loadtime/index.md b/files/fr/web/api/performanceelementtiming/loadtime/index.md index 28e33d6384..21da532b76 100644 --- a/files/fr/web/api/performanceelementtiming/loadtime/index.md +++ b/files/fr/web/api/performanceelementtiming/loadtime/index.md @@ -10,55 +10,47 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming/loadTime --- -<div>{{APIRef("Element Timing API")}}</div> +{{APIRef("Element Timing API")}} -<p>La propriété en lecture seule <strong><code>loadTime</code></strong> de l'interface <a href="/fr/docs/Web/API/PerformanceElementTiming"><code>PerformanceElementTiming</code></a> renvoie toujours 0 pour le texte. Pour les images, elle renvoie le temps qui est le plus tardif entre le moment où la ressource image est chargée et le moment où elle est attachée à l'élément.</p> +La propriété en lecture seule **`loadTime`** de l'interface [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming) renvoie toujours 0 pour le texte. Pour les images, elle renvoie le temps qui est le plus tardif entre le moment où la ressource image est chargée et le moment où elle est attachée à l'élément. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="brush:js">var <var>loadTime</var> = <var>PerformanceElementTiming</var>.loadTime;</pre> +```js +var loadTime = PerformanceElementTiming.loadTime; +``` -<h3>Valeur</h3> -<p>Un objet <a href="/fr/docs/Web/API/DOMHighResTimeStamp"><code>DOMHighResTimeStamp</code></a> avec le temps de chargement de l'élément.</p> +### Valeur -<h2 id="Examples">Exemples</h2> +Un objet [`DOMHighResTimeStamp`](/fr/docs/Web/API/DOMHighResTimeStamp) avec le temps de chargement de l'élément. -<p>Dans cet exemple, l'appel à <code>entry.loadTime</code> renvoie le temps de chargement de l'image.</p> +## Exemples -<pre class="brush:html"><img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage"></pre> +Dans cet exemple, l'appel à `entry.loadTime` renvoie le temps de chargement de l'image. -<pre class="brush:js">const <var>observer</var> = new PerformanceObserver((list) => { - let <var>entries</var> = list.getEntries().forEach(function (entry) { +```html +<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage"> +``` + +```js +const observer = new PerformanceObserver((list) => { + let entries = list.getEntries().forEach(function (entry) { if (entry.identifier === "big-image") { console.log(entry.loadTime); } }); }); -observer.observe({ entryTypes: ["element"] });</pre> +observer.observe({ entryTypes: ["element"] }); +``` -<div class="note"> - <p><strong>Note :</strong> Cet exemple utilise l'interface <a href="/fr/docs/Web/API/PerformanceObserver"><code>PerformanceObserver</code></a> pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément <a href="/fr/docs/Web/API/PerformanceEntry/entryType"><code>PerformanceEntry.entryType</code></a> afin d'utiliser l'interface <code>PerformanceElementTiming</code>.</p> -</div> +> **Note :** Cet exemple utilise l'interface [`PerformanceObserver`](/fr/docs/Web/API/PerformanceObserver) pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément [`PerformanceEntry.entryType`](/fr/docs/Web/API/PerformanceEntry/entryType) afin d'utiliser l'interface `PerformanceElementTiming`. -<h2 id="Specifications">Spécifications</h2> +## Spécifications -<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('Element Timing API','#dom-performanceelementtiming-loadtime','PerformanceElementTiming.loadTime')}}</td> - <td>{{Spec2('Element Timing API')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> +| Spécification | Statut | Commentaire | +| ---------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-loadtime','PerformanceElementTiming.loadTime')}} | {{Spec2('Element Timing API')}} | Définition initiale. | -<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.PerformanceElementTiming.loadTime")}}</p> +{{Compat("api.PerformanceElementTiming.loadTime")}} |