From 1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde Mon Sep 17 00:00:00 2001 From: julieng Date: Sat, 2 Oct 2021 17:20:24 +0200 Subject: convert content to md --- .../api/performanceelementtiming/element/index.md | 60 ++++++-------- .../web/api/performanceelementtiming/id/index.md | 58 ++++++------- .../performanceelementtiming/identifier/index.md | 58 ++++++------- files/fr/web/api/performanceelementtiming/index.md | 95 ++++++++++------------ .../intersectionrect/index.md | 62 ++++++-------- .../api/performanceelementtiming/loadtime/index.md | 60 ++++++-------- .../naturalheight/index.md | 60 ++++++-------- .../performanceelementtiming/naturalwidth/index.md | 71 ++++++++-------- .../performanceelementtiming/rendertime/index.md | 74 ++++++++--------- .../api/performanceelementtiming/tojson/index.md | 63 ++++++-------- .../web/api/performanceelementtiming/url/index.md | 60 ++++++-------- 11 files changed, 313 insertions(+), 408 deletions(-) (limited to 'files/fr/web/api/performanceelementtiming') diff --git a/files/fr/web/api/performanceelementtiming/element/index.md b/files/fr/web/api/performanceelementtiming/element/index.md index 1a40658ff7..d307ff909b 100644 --- a/files/fr/web/api/performanceelementtiming/element/index.md +++ b/files/fr/web/api/performanceelementtiming/element/index.md @@ -10,55 +10,47 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming/element --- -
{{APIRef("Element Timing API")}}
+{{APIRef("Element Timing API")}} -

La propriété en lecture seule element de l'interface PerformanceElementTiming renvoie un Element qui est une représentation littérale de l'élément associé.

+La propriété en lecture seule **`element`** de l'interface [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming) renvoie un [`Element`](/fr/docs/Web/API/Element) qui est une représentation littérale de l'élément associé. -

Syntaxe

+## Syntaxe -
var element = PerformanceElementTiming.element;
+```js +var element = PerformanceElementTiming.element; +``` -

Valeur

-

Un objet de type Element.

+### Valeur -

Exemples

+Un objet de type [`Element`](/fr/docs/Web/API/Element). -

Dans cet exemple, l'appel à entry.element va enregistrer dans la console <img src="image.jpg" alt="une belle image" elementtiming="big-image">.

+## Exemples -
<img src="image.jpg" alt="une belle image" elementtiming="big-image">
+Dans cet exemple, l'appel à `entry.element` va enregistrer dans la console `une belle image`. -
const observer = new PerformanceObserver((list) => {
-  let entries = list.getEntries().forEach(function (entry) {
+```html
+une belle image
+```
+
+```js
+const observer = new PerformanceObserver((list) => {
+  let entries = list.getEntries().forEach(function (entry) {
     if (entry.identifier === "big-image") {
       console.log(entry.element);
     }
   });
 });
-observer.observe({ entryTypes: ["element"] });
+observer.observe({ entryTypes: ["element"] }); +``` -
-

Note : Cet exemple utilise l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément PerformanceEntry.entryType afin d'utiliser l'interface PerformanceElementTiming.

-
+> **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`. -

Spécifications

+## Spécifications - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#dom-performanceelementtiming-element','PerformanceElementTiming.element')}}{{Spec2('Element Timing API')}}Définition initiale.
+| Spécification | Statut | Commentaire | +| ------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-element','PerformanceElementTiming.element')}} | {{Spec2('Element Timing API')}} | Définition initiale. | -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("api.PerformanceElementTiming.element")}}

+{{Compat("api.PerformanceElementTiming.element")}} diff --git a/files/fr/web/api/performanceelementtiming/id/index.md b/files/fr/web/api/performanceelementtiming/id/index.md index f3083cd256..f178f4ea8f 100644 --- a/files/fr/web/api/performanceelementtiming/id/index.md +++ b/files/fr/web/api/performanceelementtiming/id/index.md @@ -10,55 +10,47 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming/id --- -
{{SeeCompatTable}}{{Non-Standard_Header}}{{APIRef("Element Timing API")}}
+{{SeeCompatTable}}{{Non-Standard_Header}}{{APIRef("Element Timing API")}} -

La propriété en lecture seule id de l'interface PerformanceElementTiming renvoie l'id de l'élément associé.

+La propriété en lecture seule **`id`** de l'interface [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming) renvoie l'[`id`](/fr/docs/Web/HTML/Global_attributes#attr-id) de l'élément associé. -

Syntaxe

+## Syntaxe -
var id = PerformanceElementTiming.id;
+```js +var id = PerformanceElementTiming.id; +``` -

Valeur

-

Une chaîne de caractères DOMString.

+### Valeur -

Exemples

+Une chaîne de caractères [`DOMString`](/fr/docs/Web/API/DOMString). -

Dans cet exemple, l'appel à entry.id entraînera l'affichage dans la console du code myImage, qui est l'id de l'élément image.

+## Exemples -
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+Dans cet exemple, l'appel à `entry.id` entraînera l'affichage dans la console du code `myImage`, qui est l'[`id`](/fr/docs/Web/HTML/Global_attributes#attr-id) de l'élément image. -
const observer = new PerformanceObserver((list) => {
+```html
+une belle image
+```
+
+```js
+const observer = new PerformanceObserver((list) => {
 let entries = list.getEntries().forEach(function (entry) {
     if (entry.identifier === "big-image") {
       console.log(entry.id);
     }
   });
 });
-observer.observe({ entryTypes: ["element"] });
+observer.observe({ entryTypes: ["element"] }); +``` -
-

Note : Cet exemple utilise l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément entryType element afin d'utiliser l'interface PerformanceElementTiming.

-
+> **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 [`entryType`](/fr/docs/Web/API/PerformanceEntry/entryType) `element` afin d'utiliser l'interface `PerformanceElementTiming`. -

Spécifications

+## Spécifications - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#dom-performanceelementtiming-id','PerformanceElementTiming.id')}}{{Spec2('Element Timing API')}}Définition initiale.
+| Spécification | Statut | Commentaire | +| ------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-id','PerformanceElementTiming.id')}} | {{Spec2('Element Timing API')}} | Définition initiale. | -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("api.PerformanceElementTiming.id")}}

+{{Compat("api.PerformanceElementTiming.id")}} diff --git a/files/fr/web/api/performanceelementtiming/identifier/index.md b/files/fr/web/api/performanceelementtiming/identifier/index.md index 1fb524cf4f..b75eebe995 100644 --- a/files/fr/web/api/performanceelementtiming/identifier/index.md +++ b/files/fr/web/api/performanceelementtiming/identifier/index.md @@ -10,55 +10,47 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming/identifier --- -
{{SeeCompatTable}}{{Non-Standard_Header}}{{APIRef("Element Timing API")}}
+{{SeeCompatTable}}{{Non-Standard_Header}}{{APIRef("Element Timing API")}} -

La propriété en lecture seule identifier de l'interface PerformanceElementTiming renvoie la valeur de l'attribut elementtiming sur l'élément.

+La propriété en lecture seule **`identifier`** de l'interface [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming) renvoie la valeur de l'attribut [`elementtiming`](/fr/docs/Web/HTML/Attributes/elementtiming) sur l'élément. -

Syntaxe

+## Syntaxe -
var identifier = PerformanceElementTiming.identifier;
+```js +var identifier = PerformanceElementTiming.identifier; +``` -

Valeur

-

Une chaîne de caractères DOMString.

+### Valeur -

Examples

+Une chaîne de caractères [`DOMString`](/fr/docs/Web/API/DOMString). -

Dans cet exemple, la valeur de elementtiming est big-image. L'appel à entry.indentifier renvoie donc la chaîne de caractères big-image.

+## Examples -
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+Dans cet exemple, la valeur de [`elementtiming`](/fr/docs/Web/HTML/Attributes/elementtiming) est `big-image`. L'appel à `entry.indentifier` renvoie donc la chaîne de caractères `big-image`. -
const observer = new PerformanceObserver((list) => {
+```html
+une belle image
+```
+
+```js
+const observer = new PerformanceObserver((list) => {
   let entries = list.getEntries().forEach(function (entry) {
     if (entry.identifier === "big-image") {
       console.log(entry.naturalWidth);
     }
   });
 });
-observer.observe({ entryTypes: ["element"] });
+observer.observe({ entryTypes: ["element"] }); +``` -
-

Note : Cet exemple utilise l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément entryType element afin d'utiliser l'interface PerformanceElementTiming.

-
+> **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 [`entryType`](/fr/docs/Web/API/PerformanceEntry/entryType) `element` afin d'utiliser l'interface `PerformanceElementTiming`. -

Spécifications

+## Spécifications - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#dom-performanceelementtiming-identifier','PerformanceElementTiming.identifier')}}{{Spec2('Element Timing API')}}Définition initiale.
+| Spécification | Statut | Commentaire | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-identifier','PerformanceElementTiming.identifier')}} | {{Spec2('Element Timing API')}} | Définition initiale. | -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("api.PerformanceElementTiming.identifier")}}

+{{Compat("api.PerformanceElementTiming.identifier")}} diff --git a/files/fr/web/api/performanceelementtiming/index.md b/files/fr/web/api/performanceelementtiming/index.md index 3a591036d7..f396e7d647 100644 --- a/files/fr/web/api/performanceelementtiming/index.md +++ b/files/fr/web/api/performanceelementtiming/index.md @@ -8,75 +8,62 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming --- -
{{SeeCompatTable}}{{Non-Standard_Header}}{{APIRef("Element Timing API")}}
+{{SeeCompatTable}}{{Non-Standard_Header}}{{APIRef("Element Timing API")}} -

L'interface PerformanceElementTiming de l'API Element Timing API rapporte les informations de timing sur un élément spécifique identifié par l'auteur de la page. Par exemple, elle peut fournir des informations sur l'image principale d'un article.

+L'interface **`PerformanceElementTiming`** de l'API [Element Timing API](/fr/docs/Web/API/Element_timing_API) rapporte les informations de timing sur un élément spécifique identifié par l'auteur de la page. Par exemple, elle peut fournir des informations sur l'image principale d'un article. -

Propriétés

+## Propriétés -
-
PerformanceElementTiming.element {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}}
-
Un Element représentant l'élément pour lequel nous retournons des informations.
-
PerformanceElementTiming.id {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}}
-
Un DOMString qui est l'identifiant (attribut id) de l'élément.
-
PerformanceElementTiming.identifier {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}}
-
Une DOMString qui est la valeur de l'attribut elementtiming de l'élément.
-
PerformanceElementTiming.intersectionRect {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}}
-
Un DOMRectReadOnly qui est le rectangle de l'élément dans la fenêtre d'affichage.
-
PerformanceElementTiming.loadTime {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}}
-
Un DOMHighResTimeStamp avec l'heure de chargement de l'élément.
-
PerformanceElementTiming.naturalHeight {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}}
-
Un entier de 32 bits non signé (unsigned long) qui est la hauteur intrinsèque de l'image si cela est appliqué à une image, 0 pour le texte.
-
PerformanceElementTiming.naturalWidth {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}}
-
Un entier de 32 bits non signé (unsigned long) qui est la largeur intrinsèque de l'image si cela est appliqué à une image, 0 pour le texte.
-
PerformanceElementTiming.renderTime {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}}
-
Un DOMHighResTimeStamp avec le renderTime de l'élément.
-
PerformanceElementTiming.url {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}}
-
Une DOMString qui est l'URL initiale de la demande de ressources pour les images, 0 pour le texte.
-
+- [`PerformanceElementTiming.element`](/fr/docs/Web/API/PerformanceElementTiming/element) {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}} + - : Un [`Element`](/fr/docs/Web/API/Element) représentant l'élément pour lequel nous retournons des informations. +- [`PerformanceElementTiming.id`](/fr/docs/Web/API/PerformanceElementTiming/id) {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}} + - : Un [`DOMString`](/fr/docs/Web/API/DOMString) qui est l'identifiant (attribut [`id`](/fr/docs/Web/HTML/Global_attributes#attr-id)) de l'élément. +- [`PerformanceElementTiming.identifier`](/fr/docs/Web/API/PerformanceElementTiming/identifier) {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}} + - : Une [`DOMString`](/fr/docs/Web/API/DOMString) qui est la valeur de l'attribut [`elementtiming`](/fr/docs/Web/HTML/Attributes/elementtiming) de l'élément. +- [`PerformanceElementTiming.intersectionRect`](/fr/docs/Web/API/PerformanceElementTiming/intersectionRect) {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}} + - : Un [`DOMRectReadOnly`](/fr/docs/Web/API/DOMRectReadOnly) qui est le rectangle de l'élément dans la fenêtre d'affichage. +- [`PerformanceElementTiming.loadTime`](/fr/docs/Web/API/PerformanceElementTiming/loadTime) {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}} + - : Un [`DOMHighResTimeStamp`](/fr/docs/Web/API/DOMHighResTimeStamp) avec l'heure de chargement de l'élément. +- [`PerformanceElementTiming.naturalHeight`](/fr/docs/Web/API/PerformanceElementTiming/naturalHeight) {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}} + - : Un entier de 32 bits non signé (_unsigned long_) qui est la hauteur intrinsèque de l'image si cela est appliqué à une image, 0 pour le texte. +- [`PerformanceElementTiming.naturalWidth`](/fr/docs/Web/API/PerformanceElementTiming/naturalWidth) {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}} + - : Un entier de 32 bits non signé (_unsigned long_) qui est la largeur intrinsèque de l'image si cela est appliqué à une image, 0 pour le texte. +- [`PerformanceElementTiming.renderTime`](/fr/docs/Web/API/PerformanceElementTiming/renderTime) {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}} + - : Un [`DOMHighResTimeStamp`](/fr/docs/Web/API/DOMHighResTimeStamp) avec le renderTime de l'élément. +- [`PerformanceElementTiming.url`](/fr/docs/Web/API/PerformanceElementTiming/url) {{ReadOnlyInline}} {{Experimental_Inline}} {{Non-Standard_Inline}} + - : Une [`DOMString`](/fr/docs/Web/API/DOMString) qui est l'URL initiale de la demande de ressources pour les images, 0 pour le texte. -

Méthodes

+## Méthodes -
-
PerformanceElementTiming.toJSON() {{Experimental_Inline}} {{Non-Standard_Inline}}
-
Génère une description JSON de l'objet.
-
+- [`PerformanceElementTiming.toJSON()`](/fr/docs/Web/API/PerformanceElementTiming/toJSON) {{Experimental_Inline}} {{Non-Standard_Inline}} + - : Génère une description JSON de l'objet. -

Exemples

+## Exemples -

Dans cet exemple, nous avons deux éléments qui sont observés. Nous utilisons l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, l'observation de l'élément PerformanceEntry.entrytype element afin d'utiliser l'interface PerformanceElementTiming.

+Dans cet exemple, nous avons deux éléments qui sont observés. Nous utilisons l'interface [`PerformanceObserver`](/fr/docs/Web/API/PerformanceObserver) pour créer une liste d'événements de mesure des performances. Dans notre cas, l'observation de l'élément [`PerformanceEntry.entrytype`](/fr/docs/Web/API/PerformanceEntry/entryType) `element` afin d'utiliser l'interface `PerformanceElementTiming`. -

Deux entrées seront affichées dans la console. La première contenant les détails de l'image, la seconde les détails du nœud texte.

+Deux entrées seront affichées dans la console. La première contenant les détails de l'image, la seconde les détails du nœud texte. -
<img src="image.jpg" elementtiming="big-image">
-<p elementtiming="text" id="text-id">le texte ici</p>
+```html + +

le texte ici

+``` -
const observer = new PerformanceObserver((list) => {
+```js
+const observer = new PerformanceObserver((list) => {
   let entries = list.getEntries().forEach(function (entry) {
       console.log(entry);
   });
 });
-observer.observe({ entryTypes: ["element"] });
+observer.observe({ entryTypes: ["element"] }); +``` -

Spécifications

+## Spécifications - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#sec-performance-element-timing','PerformanceElementTiming')}}{{Spec2('Element Timing API')}}Définition initiale.
+| Spécification | Statut | Commentaire | +| -------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#sec-performance-element-timing','PerformanceElementTiming')}} | {{Spec2('Element Timing API')}} | Définition initiale. | -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

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

+{{Compat("api.PerformanceElementTiming")}} diff --git a/files/fr/web/api/performanceelementtiming/intersectionrect/index.md b/files/fr/web/api/performanceelementtiming/intersectionrect/index.md index 4954876475..a430ef9821 100644 --- a/files/fr/web/api/performanceelementtiming/intersectionrect/index.md +++ b/files/fr/web/api/performanceelementtiming/intersectionrect/index.md @@ -10,57 +10,49 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming/intersectionRect --- -
{{APIRef("Element Timing API")}}
+{{APIRef("Element Timing API")}} -

La propriété en lecture seule intersectionRect de l'interface PerformanceElementTiming renvoie le rectangle de l'élément dans la zone d'affichage (viewport).

+La propriété en lecture seule **`intersectionRect`** de l'interface [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming) renvoie le rectangle de l'élément dans la zone d'affichage (_viewport_). -

Syntaxe

+## Syntaxe -
var rect = PerformanceElementTiming.intersectionRect;
+```js +var rect = PerformanceElementTiming.intersectionRect; +``` -

Valeur

-

Un objet DOMRectReadOnly qui est le rectangle de l'élément dans la zone d'affichage.

+### Valeur -

Pour les images, il s'agit du rectangle d'affichage de l'image dans la zone d'affichage. Pour le texte, il s'agit du rectangle d'affichage du nœud dans la zone d'affichage. Il s'agit du plus petit rectangle qui contient l'union de tous les nœuds de texte appartenant à l'élément.

+Un objet [`DOMRectReadOnly`](/fr/docs/Web/API/DOMRectReadOnly) qui est le rectangle de l'élément dans la zone d'affichage. -

Exemples

+Pour les images, il s'agit du rectangle d'affichage de l'image dans la zone d'affichage. Pour le texte, il s'agit du rectangle d'affichage du nœud dans la zone d'affichage. Il s'agit du plus petit rectangle qui contient l'union de tous les nœuds de texte appartenant à l'élément. -

Dans cet exemple, l'appel à entry.intersectionRect renvoie un objet DOMRectReadOnly avec le rectangle d'affichage de l'image.

+## Exemples -
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+Dans cet exemple, l'appel à `entry.intersectionRect` renvoie un objet [`DOMRectReadOnly`](/fr/docs/Web/API/DOMRectReadOnly) avec le rectangle d'affichage de l'image. -
const observer = new PerformanceObserver((list) => {
-  let entries = list.getEntries().forEach(function (entry) {
+```html
+une belle image
+```
+
+```js
+const observer = new PerformanceObserver((list) => {
+  let entries = list.getEntries().forEach(function (entry) {
     if (entry.identifier === "big-image") {
       console.log(entry.intersectionRect);
     }
   });
 });
-observer.observe({ entryTypes: ["element"] });
+observer.observe({ entryTypes: ["element"] }); +``` -
-

Note : Cet exemple utilise l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément PerformanceEntry.entryType afin d'utiliser l'interface PerformanceElementTiming.

-
+> **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`. -

Spécifications

+## Spécifications - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#dom-performanceelementtiming-intersectionrect','PerformanceElementTiming.intersectionRect')}}{{Spec2('Element Timing API')}}Définition initiale.
+| Spécification | Statut | Commentaire | +| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-intersectionrect','PerformanceElementTiming.intersectionRect')}} | {{Spec2('Element Timing API')}} | Définition initiale. | -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("api.PerformanceElementTiming.intersectionRect")}}

+{{Compat("api.PerformanceElementTiming.intersectionRect")}} 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 --- -
{{APIRef("Element Timing API")}}
+{{APIRef("Element Timing API")}} -

La propriété en lecture seule loadTime de l'interface 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.

+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. -

Syntaxe

+## Syntaxe -
var loadTime = PerformanceElementTiming.loadTime;
+```js +var loadTime = PerformanceElementTiming.loadTime; +``` -

Valeur

-

Un objet DOMHighResTimeStamp avec le temps de chargement de l'élément.

+### Valeur -

Exemples

+Un objet [`DOMHighResTimeStamp`](/fr/docs/Web/API/DOMHighResTimeStamp) avec le temps de chargement de l'élément. -

Dans cet exemple, l'appel à entry.loadTime renvoie le temps de chargement de l'image.

+## Exemples -
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+Dans cet exemple, l'appel à `entry.loadTime` renvoie le temps de chargement de l'image. -
const observer = new PerformanceObserver((list) => {
-  let entries = list.getEntries().forEach(function (entry) {
+```html
+une belle image
+```
+
+```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"] });
+observer.observe({ entryTypes: ["element"] }); +``` -
-

Note : Cet exemple utilise l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément PerformanceEntry.entryType afin d'utiliser l'interface PerformanceElementTiming.

-
+> **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`. -

Spécifications

+## Spécifications - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#dom-performanceelementtiming-loadtime','PerformanceElementTiming.loadTime')}}{{Spec2('Element Timing API')}}Définition initiale.
+| Spécification | Statut | Commentaire | +| ---------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-loadtime','PerformanceElementTiming.loadTime')}} | {{Spec2('Element Timing API')}} | Définition initiale. | -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("api.PerformanceElementTiming.loadTime")}}

+{{Compat("api.PerformanceElementTiming.loadTime")}} diff --git a/files/fr/web/api/performanceelementtiming/naturalheight/index.md b/files/fr/web/api/performanceelementtiming/naturalheight/index.md index 204efdc562..0fc7a49636 100644 --- a/files/fr/web/api/performanceelementtiming/naturalheight/index.md +++ b/files/fr/web/api/performanceelementtiming/naturalheight/index.md @@ -10,55 +10,47 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming/naturalHeight --- -
{{APIRef("Element Timing API")}}
+{{APIRef("Element Timing API")}} -

La propriété en lecture seule naturalHeight de l'interface PerformanceElementTiming renvoie la hauteur intrinsèque de l'élément image.

+La propriété en lecture seule **`naturalHeight`** de l'interface [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming) renvoie la hauteur intrinsèque de l'élément image. -

Syntaxe

+## Syntaxe -
var height = PerformanceElementTiming.naturalHeight;
+```js +var height = PerformanceElementTiming.naturalHeight; +``` -

Valeur

-

Un entier de 32 bits non signé (unsigned long) qui est la hauteur intrinsèque de l'image si cela est appliqué à une image, 0 pour le texte.

+### Valeur -

Exemples

+Un entier de 32 bits non signé (_unsigned long_) qui est la hauteur intrinsèque de l'image si cela est appliqué à une image, 0 pour le texte. -

Dans cet exemple, le fichier image a une largeur de 1000px et une hauteur de 750px. L'appel de entry.naturalHeight renvoie 750, c'est-à-dire la hauteur intrinsèque en pixels.

+## Exemples -
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+Dans cet exemple, le fichier image a une largeur de 1000px et une hauteur de 750px. L'appel de `entry.naturalHeight` renvoie `750`, c'est-à-dire la hauteur intrinsèque en pixels. -
const observer = new PerformanceObserver((list) => {
-  let entries = list.getEntries().forEach(function (entry) {
+```html
+une belle image
+```
+
+```js
+const observer = new PerformanceObserver((list) => {
+  let entries = list.getEntries().forEach(function (entry) {
     if (entry.identifier === "big-image") {
       console.log(entry.naturalHeight);
     }
   });
 });
-observer.observe({ entryTypes: ["element"] });
+observer.observe({ entryTypes: ["element"] }); +``` -
-

Note : Cet exemple utilise l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément PerformanceEntry.entryType afin d'utiliser l'interface PerformanceElementTiming.

-
+> **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`. -

Specifications

+## Specifications - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#dom-performanceelementtiming-naturalheight','PerformanceElementTiming.naturalHeight')}}{{Spec2('Element Timing API')}}Initial definition.
+| Spécification | Statut | Commentaire | +| ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------- | ------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-naturalheight','PerformanceElementTiming.naturalHeight')}} | {{Spec2('Element Timing API')}} | Initial definition. | -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("api.PerformanceElementTiming.naturalHeight")}}

+{{Compat("api.PerformanceElementTiming.naturalHeight")}} diff --git a/files/fr/web/api/performanceelementtiming/naturalwidth/index.md b/files/fr/web/api/performanceelementtiming/naturalwidth/index.md index 3e254d3289..1843a6a58f 100644 --- a/files/fr/web/api/performanceelementtiming/naturalwidth/index.md +++ b/files/fr/web/api/performanceelementtiming/naturalwidth/index.md @@ -10,54 +10,47 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming/naturalWidth --- -
{{APIRef("Element Timing API")}}
+{{APIRef("Element Timing API")}} -

La propriété en lecture seule naturalWidth de l'interface PerformanceElementTiming renvoie la largeur intrinsèque de l'élément image.

-

Syntax

+La propriété en lecture seule **`naturalWidth`** de l'interface [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming) renvoie la largeur intrinsèque de l'élément image. -
var width = PerformanceElementTiming.naturalWidth;
+## Syntax -

Valeur

-

Un entier de 32 bits non signé (unsigned long) qui est la largeur intrinsèque de l'image si cela est appliqué à une image, 0 pour le texte.

+```js +var width = PerformanceElementTiming.naturalWidth; +``` -

Exemples

+### Valeur -

Dans cet exemple, le fichier image a une largeur de 1000px et une hauteur de 750px. L'appel de entry.naturalWidth renvoie 1000, c'est-à-dire la largeur intrinsèque en pixels.

+Un entier de 32 bits non signé (_unsigned long_) qui est la largeur intrinsèque de l'image si cela est appliqué à une image, 0 pour le texte. -
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+## Exemples -
const observer = new PerformanceObserver((list) => {
-  let entries = list.getEntries().forEach(function (entry) {
+Dans cet exemple, le fichier image a une largeur de 1000px et une hauteur de 750px. L'appel de `entry.naturalWidth` renvoie `1000`, c'est-à-dire la largeur intrinsèque en pixels.
+
+```html
+une belle image
+```
+
+```js
+const observer = new PerformanceObserver((list) => {
+  let entries = list.getEntries().forEach(function (entry) {
     if (entry.identifier === "big-image") {
       console.log(entry.naturalWidth);
     }
   });
 });
-observer.observe({ entryTypes: ["element"] });
- -
-

Note : Cet exemple utilise l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément PerformanceEntry.entryType afin d'utiliser l'interface PerformanceElementTiming.

-
- -

Specifications

- - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#dom-performanceelementtiming-naturalwidth','PerformanceElementTiming.naturalWidth')}}{{Spec2('Element Timing API')}}Définition initiale.
- -

Compatibilité des navigateurs

- -

{{Compat("api.PerformanceElementTiming.naturalWidth")}}

+observer.observe({ entryTypes: ["element"] }); +``` + +> **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`. + +## Specifications + +| Spécification | Statut | Commentaire | +| ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-naturalwidth','PerformanceElementTiming.naturalWidth')}} | {{Spec2('Element Timing API')}} | Définition initiale. | + +## Compatibilité des navigateurs + +{{Compat("api.PerformanceElementTiming.naturalWidth")}} diff --git a/files/fr/web/api/performanceelementtiming/rendertime/index.md b/files/fr/web/api/performanceelementtiming/rendertime/index.md index b541771563..3614a4f1cf 100644 --- a/files/fr/web/api/performanceelementtiming/rendertime/index.md +++ b/files/fr/web/api/performanceelementtiming/rendertime/index.md @@ -10,59 +10,51 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming/renderTime --- -
{{APIRef("Element Timing API")}}
+{{APIRef("Element Timing API")}} -

La propriété en lecture seule renderTime de l'interface PerformanceElementTiming renvoie le temps écoulé pour le rendu de l'élément associé.

+La propriété en lecture seule **`renderTime`** de l'interface [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming) renvoie le temps écoulé pour le rendu de l'élément associé. -

Syntaxe

+## Syntaxe -
var renderTime = PerformanceElementTiming.renderTime;
+```js +var renderTime = PerformanceElementTiming.renderTime; +``` -

Valeur

-

Un objet DOMHighResTimeStamp avec le temps de rendu de l'élément.

+### Valeur -

Pour les images, il s'agira de l'horodatage du rendu de l'image. Ceci est défini comme le moment du rendu suivant le chargement complet de l'image. Si la vérification de l'autorisation de temporisation échoue (comme défini par l'en-tête Timing-allow-origin), ceci retournera 0.

+Un objet [`DOMHighResTimeStamp`](/fr/docs/Web/API/DOMHighResTimeStamp) avec le temps de rendu de l'élément. -

Pour les nœuds de texte, il s'agira de l'horodatage du rendu du texte. Ceci est défini comme le moment où l'élément est affiché à l'écran.

+Pour les images, il s'agira de l'**horodatage du rendu de l'image**. Ceci est défini comme le moment du rendu suivant le chargement complet de l'image. Si la vérification de l'autorisation de temporisation échoue (comme défini par l'en-tête [Timing-allow-origin](/fr/docs/Web/HTTP/Headers/Timing-Allow-Origin)), ceci retournera 0. -

Exemples

+Pour les nœuds de texte, il s'agira de l'**horodatage du rendu du texte**. Ceci est défini comme le moment où l'élément est affiché à l'écran. -

Dans cet exemple, appeler entry.renderTime renvoie le temps de rendu de l'élément image.

+## Exemples -
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+Dans cet exemple, appeler `entry.renderTime` renvoie le temps de rendu de l'élément image. -
const observer = new PerformanceObserver((list) => {
-  let entries = list.getEntries().forEach(function (entry) {
+```html
+une belle image
+```
+
+```js
+const observer = new PerformanceObserver((list) => {
+  let entries = list.getEntries().forEach(function (entry) {
     if (entry.identifier === "big-image") {
       console.log(entry.renderTime);
     }
   });
 });
-observer.observe({ entryTypes: ["element"] });
- -
-

Note : Cet exemple utilise l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément PerformanceEntry.entryType afin d'utiliser l'interface PerformanceElementTiming.

-
- -

Spécifications

- - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#dom-performanceelementtiming-rendertime','PerformanceElementTiming.renderTime')}}{{Spec2('Element Timing API')}}Définition initiale.
- -

Compatibilité des navigateurs

- -

{{Compat("api.PerformanceElementTiming.renderTime")}}

+observer.observe({ entryTypes: ["element"] }); +``` + +> **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`. + +## Spécifications + +| Spécification | Statut | Commentaire | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-rendertime','PerformanceElementTiming.renderTime')}} | {{Spec2('Element Timing API')}} | Définition initiale. | + +## Compatibilité des navigateurs + +{{Compat("api.PerformanceElementTiming.renderTime")}} diff --git a/files/fr/web/api/performanceelementtiming/tojson/index.md b/files/fr/web/api/performanceelementtiming/tojson/index.md index b0dd7affae..bf0eb51cb8 100644 --- a/files/fr/web/api/performanceelementtiming/tojson/index.md +++ b/files/fr/web/api/performanceelementtiming/tojson/index.md @@ -10,59 +10,48 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming/toJSON --- -
{{APIRef("Element Timing API")}}
+{{APIRef("Element Timing API")}} -

La méthode toJSON() de l'interface PerformanceElementTiming est un sérialiseur standard. Elle renvoie une représentation JSON des propriétés de l'objet.

+La méthode **`toJSON()`** de l'interface [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming) est un sérialiseur standard. Elle renvoie une représentation JSON des propriétés de l'objet. -

Syntaxe

+## Syntaxe -
var json = PerformanceElementTiming.toJSON();
+```js +var json = PerformanceElementTiming.toJSON(); +``` -

Valeur de retour

+### Valeur de retour -
-
json
-
Un objet JSON qui est la sérialisation de l'objet PerformanceElementTiming.
-
+- `json` + - : Un objet JSON qui est la sérialisation de l'objet [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming). -

Exemples

+## Exemples -

Dans cet exemple, l'appel de entry.toJSON() renvoie une représentation JSON de l'objet PerformanceElementTiming, avec les informations sur l'élément image.

+Dans cet exemple, l'appel de `entry.toJSON()` renvoie une représentation JSON de l'objet [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming), avec les informations sur l'élément image. -
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+```html +une belle image +``` -
const observer = new PerformanceObserver((list) => {
-  let entries = list.getEntries().forEach(function (entry) {
+```js
+const observer = new PerformanceObserver((list) => {
+  let entries = list.getEntries().forEach(function (entry) {
     if (entry.identifier === "big-image") {
       console.log(entry.toJSON());
     }
   });
 });
-observer.observe({ entryTypes: ["element"] });
+observer.observe({ entryTypes: ["element"] }); +``` -
-

Note : Cet exemple utilise l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément PerformanceEntry.entryType afin d'utiliser l'interface PerformanceElementTiming.

-
+> **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`. -

Spécifications

+## Spécifications - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#dom-performanceelementtiming-tojson','PerformanceElementTiming.toJson()')}}{{Spec2('Element Timing API')}}Définition initiale.
+| Spécification | Statut | Commentaire | +| ------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-tojson','PerformanceElementTiming.toJson()')}} | {{Spec2('Element Timing API')}} | Définition initiale. | -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("api.PerformanceElementTiming.toJSON")}}

+{{Compat("api.PerformanceElementTiming.toJSON")}} diff --git a/files/fr/web/api/performanceelementtiming/url/index.md b/files/fr/web/api/performanceelementtiming/url/index.md index 6828122328..bc22f2c6e6 100644 --- a/files/fr/web/api/performanceelementtiming/url/index.md +++ b/files/fr/web/api/performanceelementtiming/url/index.md @@ -10,55 +10,47 @@ tags: - PerformanceElementTiming translation_of: Web/API/PerformanceElementTiming/url --- -
{{APIRef("Element Timing API")}}
+{{APIRef("Element Timing API")}} -

La propriété en lecture seule url de l'interface PerformanceElementTiming renvoie l'URL initiale de la demande de ressource lorsque l'élément est une image.

+La propriété en lecture seule **`url`** de l'interface [`PerformanceElementTiming`](/fr/docs/Web/API/PerformanceElementTiming) renvoie l'URL initiale de la demande de ressource lorsque l'élément est une image. -

Syntaxe

+## Syntaxe -
var url = PerformanceElementTiming.url;
+```js +var url = PerformanceElementTiming.url; +``` -

Valeur

-

Une DOMString qui est l'URL initiale de la demande de ressources pour les images ou 0 pour le texte.

+### Valeur -

Exemples

+Une [`DOMString`](/fr/docs/Web/API/DOMString) qui est l'URL initiale de la demande de ressources pour les images ou 0 pour le texte. -

Dans cet exemple, appeler entry.url renvoie https://example.com/image.jpg.

+## Exemples -
<img src="https://example.com/image.jpg" alt="une belle imahe" elementtiming="big-image" id="myImage">
+Dans cet exemple, appeler `entry.url` renvoie `https://example.com/image.jpg`. -
const observer = new PerformanceObserver((list) => {
-  let entries = list.getEntries().forEach(function (entry) {
+```html
+une belle imahe
+```
+
+```js
+const observer = new PerformanceObserver((list) => {
+  let entries = list.getEntries().forEach(function (entry) {
     if (entry.identifier === "big-image") {
       console.log(entry.url);
     }
   });
 });
-observer.observe({ entryTypes: ["element"] });
+observer.observe({ entryTypes: ["element"] }); +``` -
-

Note : Cet exemple utilise l'interface PerformanceObserver pour créer une liste d'événements de mesure des performances. Dans notre cas, nous observons l'élément PerformanceEntry.entryType afin d'utiliser l'interface PerformanceElementTiming.

-
+> **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`. -

Spécifications

+## Spécifications - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Element Timing API','#dom-performanceelementtiming-url','PerformanceElementTiming.url')}}{{Spec2('Element Timing API')}}Définition initiale.
+| Spécification | Statut | Commentaire | +| ---------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------- | -------------------- | +| {{SpecName('Element Timing API','#dom-performanceelementtiming-url','PerformanceElementTiming.url')}} | {{Spec2('Element Timing API')}} | Définition initiale. | -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("api.PerformanceElementTiming.url")}}

+{{Compat("api.PerformanceElementTiming.url")}} -- cgit v1.2.3-54-g00ecf