From 48a326c0d47c8f49eb50706420a33bfcbe24f2c7 Mon Sep 17 00:00:00 2001 From: tristantheb Date: Sun, 11 Apr 2021 09:03:44 +0200 Subject: L10N: Translation of all Performance APIs/Interfaces/Properties/Methods (#232) * L10N: Translation of the Performance API pages * L10N: Translation of the Performance Timeline API pages * Fix typo, style and KS elements * UPDATE: Update content of code blocks with the Guideline * L10N: Translation of the PerformanceElementTiming pages * L10N: Translation of the PerformanceEntry pages * L10N: Translation of the PerformanceEventTiming interface * L10N: Translation of the PerformanceFrameTiming interface * L10N: Translation of the PerformanceLongTaskTiming interface * L10N: Translation of the PerformanceMark interface * L10N: Translation of the PerformanceMeasure interface * L10N: Translation of the PerformanceNavigation interface * L10N: Translation of the PerformanceNavigationTiming interface * L10N: Translation of the PerformanceObserver interface * L10N: Translation of the PerformanceObserverEntryList interface * L10N: Translation of the PerformancePaintTiming interface * L10N: Translation of the PerformanceResourceTiming interface * L10N: Translation of the PerformanceServerTiming interface * L10N: Translation of the PerformanceTiming interface * FIX: Fix KS error on PerformanceTiming interface * FIX: Change some summary and typo * FIX: Fix CSS and sentences on PerformanceObserverEntryList interface * FIX: Update KS + Change {{event()}} by link on PerformanceEventTiming interface * Review - Landing page * Review 'using' page - rm domxref * Perforamance_timeline review: rm domxref, minor rewording, missing translation * Review timeline guide page, rm domxref, rm vars in pre * Review - PerformanceElementTiming - rm domxref + trailing spaces * Review - PerformanceElementTiming.id - rm xref macros + trailing spaces * Review - PerformanceElementTiming.identifier - rm xref macros + trailing spaces * Review - PerformanceElementTiming - rm xref macros + trailing spaces * Review - PET.intersectionrect - rm domxref / minor typos * Undo spec table mixup * Review - loadTime - rm domxref * Review - naturalheight - rm domxref / trailing spaces * Review - naturalwidth - rm domxref / trailing spaces * Review - renderTime - rm domxref / trailing spaces / minor rewordings * Review - tojson - rm domxref / trailing spaces * Review - url - rm domxref / trailing spaces * Review - duration - rm domxref / minor rewordings * Review - entryType - rm domxref / minor rewordings * Review - performanceentry index - rm domxref / minor rewordings * Review PerformanceEntry.name - rm xref macros * Review PerformanceEntry.startTime - rm xref macros * Review PerformanceEntry.toJSON - rm xref macros * Review PerformanceEventTiming - rm domxref * Review PerformanceFrameTiming - rm xref macros * Review PerformanceLongTaskTiming.attribution - rm xref macros * Review PerformanceLongTaskTiming - rm xref macros * Review - PerformanceMark - rm domxref * Review - PerformanceMeasure - rm domxref * Review - PerformanceNavigation - rm domxref * Review - PerformanceNavigation.redirectcount - rm domxref * Review - PerformanceNavigation.type - rm domxref * Review - PerformanceNavigationTiming.domComplete - rm domxref * Review - PerformanceNavigationTiming.domContentLoadedEvent - rm domxref * Review - PerformanceNavigationTiming.domContentLoadedEventStart - rm domxref * Review - PerformanceNavigationTiming.domInteractive - rm domxref * Review - PerformanceNavigationTiming - rm domxref * Review - PerformanceNavigationTiming.loadEventEnd - rm domxref * Review - PerformanceNavigationTiming.loadEventStart - rm domxref * Review - PerformanceNavigationTiming.redirectCount - rm domxref * Review - PerformanceNavigationTiming.toJSON - rm domxref * Review - PerformanceNavigationTiming.type - rm domxref * Review - PerformanceNavigationTiming.unloadEventEnd - rm domxref * Review - PerformanceNavigationTiming.unloadEventStart - rm domxref * Remove DOMxRef for PerformanceTiming * Remove DOMxRef for PerformanceServerTiming * Remove DOMxRef for PerformanceResourceTiming * Review - PerformanceObserver.disconnect - rm domxref * Review - PerformanceObserver - rm domxref * Review - PerformanceObserver.observe - rm domxref * Review - PerformanceObserver.PerformanceObserver() - rm domxref * Review - PerformanceObserver.takeRecords() - rm domxref * Review - PerformanceObserverEntryList.getEntries() - rm domxref * Review - PerformanceObserver.getEntriesByName() - rm domxref * Review - PerformanceObserver.getEntriesByType() - rm domxref * Review - PerformanceObserverEntryList - rm domxref * Review - PerformanceResourceTiming.connectEnd - rm domxref * Review - PerformanceResourceTiming.connectStart * Review - PerformanceResourceTiming.decodedBodySize * Review - PerformanceResourceTiming.domainLookupEnd * Review - PerformanceResourceTiming.domainLookupStart * Review - PerformanceResourceTiming.encodedBodySize * Review - PerformanceResourceTiming.fetchStart * Review - PerformanceResourceTiming * Review - PerformanceResourceTiming.iniatorType * Review - PerformanceResourceTiming.nextHopProtocol * Review - PerformanceResourceTiming.redirectEnd * Review - PerformanceResourceTiming.redirectStart * Review - PerformanceResourceTiming.requestStart * Review - PerformanceResourceTiming.responseEnd * Review - PerformanceResourceTiming.responseStart * Review - PerformanceResourceTiming.secureConnectionStart * Review - PerformanceResourceTiming.toJSON() * Review - PerformanceResourceTiming.transferSize * Review - PerformanceResourceTiming.workerStart * Review - PerformanceServerTiming.description * Review - PerformanceServerTiming.duration * Review - PerformanceServerTiming * Review - PerformanceServerTiming.name * Review - PerformanceServerTiming.toJSON() * Review - PerformanceTiming.domComplete - rm Event * Review - PerformanceTiming.domContentLoadedEventStart - rm Event * Review - PerformanceTiming.domInteractive - rm Event * Review - PerformanceTiming.domLoading - rm Event * Review - PerformanceTiming - minor typos + thead spec * Review - PerformanceTiming.loadEventEnd - rm Event * Review - PerformanceTiming.loadEventStart - rm Event * Review - PerformanceTiming.unloadEventEnd - rm Event * Review - PerformanceTiming.unloadEventStart - rm Event * Remove final domxref / rm var in examples Co-authored-by: julieng --- files/fr/web/api/performance_api/index.html | 147 ++++++++++++++ .../using_the_performance_api/index.html | 107 ++++++++++ files/fr/web/api/performance_timeline/index.html | 80 ++++++++ .../using_performance_timeline/index.html | 221 +++++++++++++++++++++ .../performanceelementtiming/element/index.html | 62 ++++++ .../web/api/performanceelementtiming/id/index.html | 62 ++++++ .../performanceelementtiming/identifier/index.html | 62 ++++++ .../fr/web/api/performanceelementtiming/index.html | 82 ++++++++ .../intersectionrect/index.html | 64 ++++++ .../performanceelementtiming/loadtime/index.html | 62 ++++++ .../naturalheight/index.html | 62 ++++++ .../naturalwidth/index.html | 61 ++++++ .../performanceelementtiming/rendertime/index.html | 66 ++++++ .../api/performanceelementtiming/tojson/index.html | 66 ++++++ .../api/performanceelementtiming/url/index.html | 62 ++++++ .../web/api/performanceentry/duration/index.html | 120 +++++++++++ .../web/api/performanceentry/entrytype/index.html | 138 +++++++++++++ files/fr/web/api/performanceentry/index.html | 147 ++++++++++++++ files/fr/web/api/performanceentry/name/index.html | 150 ++++++++++++++ .../web/api/performanceentry/starttime/index.html | 122 ++++++++++++ .../fr/web/api/performanceentry/tojson/index.html | 107 ++++++++++ files/fr/web/api/performanceeventtiming/index.html | 170 ++++++++++++++++ files/fr/web/api/performanceframetiming/index.html | 75 +++++++ .../attribution/index.html | 46 +++++ .../web/api/performancelongtasktiming/index.html | 46 +++++ files/fr/web/api/performancemark/index.html | 76 +++++++ files/fr/web/api/performancemeasure/index.html | 76 +++++++ files/fr/web/api/performancenavigation/index.html | 87 ++++++++ .../performancenavigation/redirectcount/index.html | 58 ++++++ .../web/api/performancenavigation/type/index.html | 89 +++++++++ .../domcomplete/index.html | 74 +++++++ .../domcontentloadedeventend/index.html | 75 +++++++ .../domcontentloadedeventstart/index.html | 75 +++++++ .../dominteractive/index.html | 74 +++++++ .../web/api/performancenavigationtiming/index.html | 106 ++++++++++ .../loadeventend/index.html | 74 +++++++ .../loadeventstart/index.html | 74 +++++++ .../redirectcount/index.html | 74 +++++++ .../performancenavigationtiming/tojson/index.html | 66 ++++++ .../performancenavigationtiming/type/index.html | 85 ++++++++ .../unloadeventend/index.html | 74 +++++++ .../unloadeventstart/index.html | 74 +++++++ .../api/performanceobserver/disconnect/index.html | 66 ++++++ files/fr/web/api/performanceobserver/index.html | 75 +++++++ .../web/api/performanceobserver/observe/index.html | 79 ++++++++ .../performanceobserver/index.html | 71 +++++++ .../api/performanceobserver/takerecords/index.html | 68 +++++++ .../getentries/index.html | 115 +++++++++++ .../getentriesbyname/index.html | 105 ++++++++++ .../getentriesbytype/index.html | 102 ++++++++++ .../api/performanceobserverentrylist/index.html | 63 ++++++ files/fr/web/api/performancepainttiming/index.html | 81 ++++++++ .../connectend/index.html | 84 ++++++++ .../connectstart/index.html | 84 ++++++++ .../decodedbodysize/index.html | 84 ++++++++ .../domainlookupend/index.html | 86 ++++++++ .../domainlookupstart/index.html | 84 ++++++++ .../encodedbodysize/index.html | 83 ++++++++ .../fetchstart/index.html | 86 ++++++++ .../web/api/performanceresourcetiming/index.html | 118 +++++++++++ .../initiatortype/index.html | 78 ++++++++ .../nexthopprotocol/index.html | 72 +++++++ .../redirectend/index.html | 86 ++++++++ .../redirectstart/index.html | 86 ++++++++ .../requeststart/index.html | 86 ++++++++ .../responseend/index.html | 84 ++++++++ .../responsestart/index.html | 84 ++++++++ .../secureconnectionstart/index.html | 85 ++++++++ .../servertiming/index.html | 51 +++++ .../performanceresourcetiming/tojson/index.html | 67 +++++++ .../transfersize/index.html | 83 ++++++++ .../workerstart/index.html | 84 ++++++++ .../performanceservertiming/description/index.html | 51 +++++ .../performanceservertiming/duration/index.html | 51 +++++ .../fr/web/api/performanceservertiming/index.html | 98 +++++++++ .../api/performanceservertiming/name/index.html | 50 +++++ .../api/performanceservertiming/tojson/index.html | 55 +++++ .../api/performancetiming/connectend/index.html | 57 ++++++ .../api/performancetiming/connectstart/index.html | 57 ++++++ .../performancetiming/domainlookupend/index.html | 57 ++++++ .../performancetiming/domainlookupstart/index.html | 57 ++++++ .../api/performancetiming/domcomplete/index.html | 57 ++++++ .../domcontentloadedeventend/index.html | 58 ++++++ .../domcontentloadedeventstart/index.html | 58 ++++++ .../performancetiming/dominteractive/index.html | 61 ++++++ .../api/performancetiming/domloading/index.html | 57 ++++++ .../api/performancetiming/fetchstart/index.html | 57 ++++++ files/fr/web/api/performancetiming/index.html | 117 +++++++++++ .../api/performancetiming/loadeventend/index.html | 57 ++++++ .../performancetiming/loadeventstart/index.html | 57 ++++++ .../performancetiming/navigationstart/index.html | 57 ++++++ .../api/performancetiming/redirectend/index.html | 57 ++++++ .../api/performancetiming/redirectstart/index.html | 57 ++++++ .../api/performancetiming/requeststart/index.html | 57 ++++++ .../api/performancetiming/responseend/index.html | 57 ++++++ .../api/performancetiming/responsestart/index.html | 57 ++++++ .../secureconnectionstart/index.html | 57 ++++++ .../performancetiming/unloadeventend/index.html | 57 ++++++ .../performancetiming/unloadeventstart/index.html | 57 ++++++ 99 files changed, 7803 insertions(+) create mode 100644 files/fr/web/api/performance_api/index.html create mode 100644 files/fr/web/api/performance_api/using_the_performance_api/index.html create mode 100644 files/fr/web/api/performance_timeline/index.html create mode 100644 files/fr/web/api/performance_timeline/using_performance_timeline/index.html create mode 100644 files/fr/web/api/performanceelementtiming/element/index.html create mode 100644 files/fr/web/api/performanceelementtiming/id/index.html create mode 100644 files/fr/web/api/performanceelementtiming/identifier/index.html create mode 100644 files/fr/web/api/performanceelementtiming/index.html create mode 100644 files/fr/web/api/performanceelementtiming/intersectionrect/index.html create mode 100644 files/fr/web/api/performanceelementtiming/loadtime/index.html create mode 100644 files/fr/web/api/performanceelementtiming/naturalheight/index.html create mode 100644 files/fr/web/api/performanceelementtiming/naturalwidth/index.html create mode 100644 files/fr/web/api/performanceelementtiming/rendertime/index.html create mode 100644 files/fr/web/api/performanceelementtiming/tojson/index.html create mode 100644 files/fr/web/api/performanceelementtiming/url/index.html create mode 100644 files/fr/web/api/performanceentry/duration/index.html create mode 100644 files/fr/web/api/performanceentry/entrytype/index.html create mode 100644 files/fr/web/api/performanceentry/index.html create mode 100644 files/fr/web/api/performanceentry/name/index.html create mode 100644 files/fr/web/api/performanceentry/starttime/index.html create mode 100644 files/fr/web/api/performanceentry/tojson/index.html create mode 100644 files/fr/web/api/performanceeventtiming/index.html create mode 100644 files/fr/web/api/performanceframetiming/index.html create mode 100644 files/fr/web/api/performancelongtasktiming/attribution/index.html create mode 100644 files/fr/web/api/performancelongtasktiming/index.html create mode 100644 files/fr/web/api/performancemark/index.html create mode 100644 files/fr/web/api/performancemeasure/index.html create mode 100644 files/fr/web/api/performancenavigation/index.html create mode 100644 files/fr/web/api/performancenavigation/redirectcount/index.html create mode 100644 files/fr/web/api/performancenavigation/type/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/domcomplete/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/domcontentloadedeventend/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/domcontentloadedeventstart/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/dominteractive/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/loadeventend/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/loadeventstart/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/redirectcount/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/tojson/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/type/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/unloadeventend/index.html create mode 100644 files/fr/web/api/performancenavigationtiming/unloadeventstart/index.html create mode 100644 files/fr/web/api/performanceobserver/disconnect/index.html create mode 100644 files/fr/web/api/performanceobserver/index.html create mode 100644 files/fr/web/api/performanceobserver/observe/index.html create mode 100644 files/fr/web/api/performanceobserver/performanceobserver/index.html create mode 100644 files/fr/web/api/performanceobserver/takerecords/index.html create mode 100644 files/fr/web/api/performanceobserverentrylist/getentries/index.html create mode 100644 files/fr/web/api/performanceobserverentrylist/getentriesbyname/index.html create mode 100644 files/fr/web/api/performanceobserverentrylist/getentriesbytype/index.html create mode 100644 files/fr/web/api/performanceobserverentrylist/index.html create mode 100644 files/fr/web/api/performancepainttiming/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/connectend/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/connectstart/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/decodedbodysize/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/domainlookupend/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/domainlookupstart/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/encodedbodysize/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/fetchstart/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/initiatortype/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/nexthopprotocol/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/redirectend/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/redirectstart/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/requeststart/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/responseend/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/responsestart/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/secureconnectionstart/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/servertiming/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/tojson/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/transfersize/index.html create mode 100644 files/fr/web/api/performanceresourcetiming/workerstart/index.html create mode 100644 files/fr/web/api/performanceservertiming/description/index.html create mode 100644 files/fr/web/api/performanceservertiming/duration/index.html create mode 100644 files/fr/web/api/performanceservertiming/index.html create mode 100644 files/fr/web/api/performanceservertiming/name/index.html create mode 100644 files/fr/web/api/performanceservertiming/tojson/index.html create mode 100644 files/fr/web/api/performancetiming/connectend/index.html create mode 100644 files/fr/web/api/performancetiming/connectstart/index.html create mode 100644 files/fr/web/api/performancetiming/domainlookupend/index.html create mode 100644 files/fr/web/api/performancetiming/domainlookupstart/index.html create mode 100644 files/fr/web/api/performancetiming/domcomplete/index.html create mode 100644 files/fr/web/api/performancetiming/domcontentloadedeventend/index.html create mode 100644 files/fr/web/api/performancetiming/domcontentloadedeventstart/index.html create mode 100644 files/fr/web/api/performancetiming/dominteractive/index.html create mode 100644 files/fr/web/api/performancetiming/domloading/index.html create mode 100644 files/fr/web/api/performancetiming/fetchstart/index.html create mode 100644 files/fr/web/api/performancetiming/index.html create mode 100644 files/fr/web/api/performancetiming/loadeventend/index.html create mode 100644 files/fr/web/api/performancetiming/loadeventstart/index.html create mode 100644 files/fr/web/api/performancetiming/navigationstart/index.html create mode 100644 files/fr/web/api/performancetiming/redirectend/index.html create mode 100644 files/fr/web/api/performancetiming/redirectstart/index.html create mode 100644 files/fr/web/api/performancetiming/requeststart/index.html create mode 100644 files/fr/web/api/performancetiming/responseend/index.html create mode 100644 files/fr/web/api/performancetiming/responsestart/index.html create mode 100644 files/fr/web/api/performancetiming/secureconnectionstart/index.html create mode 100644 files/fr/web/api/performancetiming/unloadeventend/index.html create mode 100644 files/fr/web/api/performancetiming/unloadeventstart/index.html (limited to 'files/fr/web') diff --git a/files/fr/web/api/performance_api/index.html b/files/fr/web/api/performance_api/index.html new file mode 100644 index 0000000000..adcb3ced5c --- /dev/null +++ b/files/fr/web/api/performance_api/index.html @@ -0,0 +1,147 @@ +--- +title: Performance API +slug: Web/API/Performance_API +tags: + - API + - Guide + - Aperçu + - Performance + - Performance Web +translation_of: Web/API/Performance_API +--- +
{{DefaultAPISidebar("High Resolution Time")}}
+ +

La norme High Resolution Time définit l'interface Performance qui prend en charge les mesures de latence côté client au sein des applications. Les interfaces Performance sont considérées comme étant à haute résolution, car elles sont précises au millième de milliseconde (sous réserve de contraintes matérielles ou logicielles). Les interfaces prennent en charge un certain nombre de cas d'utilisation, notamment le calcul des taux de trame (potentiellement important dans les animations) et l'évaluation comparative (comme le temps de chargement d'une ressource).

+ +

Comme l'horloge système d'une plateforme est sujette à divers décalages (comme les ajustements NTP), les interfaces prennent en charge une horloge monotone, c'est-à-dire une horloge toujours croissante. À ce titre, l'API Performance définit un type DOMHighResTimeStamp plutôt que d'utiliser l'interface {{jsxref("Date.now", "Date.now()")}}.

+ +

DOMHighResTimeStamp

+ +

Le type DOMHighResTimeStamp, comme son nom l'indique, représente un point temporel de haute résolution. Ce type est un double et est utilisé par les interfaces de performance. La valeur peut être un point discret dans le temps ou la différence de temps entre deux points discrets dans le temps.

+ +

L'unité de DOMHighResTimeStamp est la milliseconde et doit être précise à 5 µs (microsecondes). Toutefois, si le navigateur n'est pas en mesure de fournir une valeur temporelle précise à 5 microsecondes (en raison, par exemple, de contraintes matérielles ou logicielles), le navigateur peut représenter la valeur comme un temps en millisecondes précis à la milliseconde près.

+ +

Méthodes

+ +

L'interface Performance possède deux méthodes. La méthode now() renvoie un DOMHighResTimeStamp dont la valeur dépend de navigationStart et du contexte. Si le contexte est une fenêtre, la valeur est l'heure de création du contexte du navigateur et si le contexte est un Worker, la valeur est l'heure de création du worker.

+ +

La méthode toJSON() renvoie une sérialisation de l'objet Performance, pour les attributs qui peuvent être sérialisés.

+ +

Propriétés

+ +

L'interface Performance possède deux propriétés. La propriété timing {{deprecated_inline}} renvoie un objet PerformanceTiming contenant des informations de performance liées à la latence, telles que l'heure de début de navigation, les heures de début et de fin des redirections, les heures de début et de fin des réponses, etc.

+ +

La propriété navigation {{deprecated_inline}} renvoie un objet PerformanceNavigation représentant le type de navigation qui se produit dans le contexte de navigation donné, comme la page vers laquelle on a navigué depuis l'historique, la page vers laquelle on a navigué en suivant un lien, etc.

+ +

Interfaces

+ +
+
Performance
+
Fournit des méthodes et des propriétés contenant des informations sur les performances liées au temps pour la page donnée.
+
PerformanceEntry
+
Fournit des méthodes et des propriétés pour encapsuler une seule mesure de performance qui fait partie de la chronologie des performances.
+
PerformanceFrameTiming
+
Fournit des méthodes et des propriétés contenant des données de synchronisation de trame sur la boucle d'événements du navigateur.
+
PerformanceMark
+
Une interface abstraite pour les entrées de performance avec un type d'entrée de « mark ». Les entrées de ce type sont créées en appelant performance.mark() pour ajouter un DOMHighResTimeStamp (un marqueur) à la chronologie des performances du navigateur.
+
PerformanceMeasure
+
Une interface abstraite pour les entrées de performance avec un type d'entrée de « measure ». Les entrées de ce type sont créées en appelant performance.measure() pour ajouter un DOMHighResTimeStamp (une mesure) entre deux marqueurs à la chronologie des performances du navigateur.
+
PerformanceNavigationTiming
+
Fournit des méthodes et des propriétés pour stocker et récupérer les horodatages haute résolution ou des métriques concernant les événements de navigation de document du navigateur.
+
PerformanceObserver
+
Fournit des méthodes et des propriétés utilisées pour observer les événements de mesure des performances et être informé des nouvelles entrées de performance lorsqu'elles sont enregistrées dans la chronologie des performances du navigateur.
+
PerformanceResourceTiming
+
Fournit des méthodes et des propriétés permettant de récupérer et d'analyser des données détaillées de synchronisation du réseau concernant le chargement des ressources d'une application.
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Highres Time')}}{{Spec2('Highres Time')}}Définition initiale.
{{SpecName('Highres Time Level 2')}}{{Spec2('Highres Time Level 2')}}Ajout de l'attribut performance sur Window et WorkerGlobalScope.
{{SpecName('Highres Time Level 3')}}{{Spec2('Highres Time Level 3')}}Ajout de la propriété timeOrigin à l'interface Performance.
{{SpecName('Frame Timing')}}{{Spec2('Frame Timing')}}Ajout de l'interface PerformanceFrameTiming.
{{SpecName('Navigation Timing')}}{{Spec2('Navigation Timing')}}Ajout des interfaces PerformanceTiming et PerformanceNavigation. Ajout des propriétés timing et navigation à l'interface Performance.
{{SpecName('Navigation Timing Level 2')}}{{Spec2('Navigation Timing Level 2')}}Ajout de l'interface PerformanceNavigationTiming. Rend obsolète l'interface PerformanceTiming, l'interface PerformanceNavigation, ainsi que les propriétés timing et navigation à l'interface Performance.
{{SpecName('Performance Timeline')}}{{Spec2('Performance Timeline')}}Ajout de l'interface PerformanceEntry, du type PerformanceEntryList, ainsi que les méthodes getEntries(), getEntriesByType(), et getEntriesByName() sur l'interface Performance.
{{SpecName('Performance Timeline Level 2')}}{{Spec2('Performance Timeline Level 2')}}Ajout d'un sérialiseur à l'interface PerformanceEntry ainsi que l'ajout de l'interface PerformanceObserver et du rappel (« callback »).
{{SpecName('Resource Timing')}}{{Spec2('Resource Timing')}}Ajout de l'interface PerformanceResourceTiming. Ajout de la méthode clearResourceTiming(), la méthode setResourceTimingBufferSize() et du gestionnaire d'événements onresourcetimingbufferfull à l'interface Performance. Ajout de l'en-tête de réponse Timing-Allow-Origin.
{{SpecName('Resource Timing 2')}}{{Spec2('Resource Timing 2')}}Ajout des propriétés nextHopProtocol, workerStart, transferSize, encodedBodySize et decodedBodySize à l'interface PerformanceResourceTiming.
{{SpecName('Resource Timing 3')}}{{Spec2('Resource Timing 3')}}
{{SpecName('User Timing')}}{{Spec2('User Timing')}}Ajout des méthodes mark(), clearMarks(), measure() et clearMeasures() à l'interface Performance. Ajout des interfaces PerformanceMark et PeformanceMeasure.
{{SpecName('User Timing Level 2')}}{{Spec2('User Timing Level 2')}}
+ +

État de l'implémentation'

+ +

Comme le montre le tableau Compatibilité des navigateurs de l'interface Performance, la plupart de ces interfaces sont largement implémentées par les navigateurs de bureau.

+ +

Pour tester le support de votre navigateur pour l'interface Performance, exécutez l'application perf-api-support.

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performance_api/using_the_performance_api/index.html b/files/fr/web/api/performance_api/using_the_performance_api/index.html new file mode 100644 index 0000000000..7386e4081a --- /dev/null +++ b/files/fr/web/api/performance_api/using_the_performance_api/index.html @@ -0,0 +1,107 @@ +--- +title: Utilisation de l'API Performance +slug: Web/API/Performance_API/Using_the_Performance_API +tags: + - API + - Guide + - Aperçu + - Performance + - Performance Web +translation_of: Web/API/Performance_API/Using_the_Performance_API +--- +
{{DefaultAPISidebar("High Resolution Time")}}
+ +

Une exigence fondamentale de la performance web est une définition précise et cohérente du temps. Le type DOMHighResTimeStamp (un double) est utilisé par toutes les interfaces de performance pour contenir de telles valeurs de temps. En outre, il doit y avoir un moyen de créer une empreinte temporelle pour un point spécifique dans le temps ; ceci est fait avec la méthode now().

+ +

Les interfaces de performance web sont définies dans un ensemble de normes. L'interface de base de ces normes est l'interface Performance et ses méthodes et propriétés sont étendues par différentes normes. Ce guide décrit comment utiliser les interfaces Performance qui sont définies dans la norme High-Resolution Time. D'autres guides sur les performances web (répertoriés dans la section Voir aussi) décrivent comment utiliser des méthodes et propriétés supplémentaires de l'interface Performance.

+ +

Chronométrage de haute précision

+ +

Le chronométrage de haute précision est obtenu en utilisant le type DOMHighResTimeStamp pour les valeurs de temps. L'unité est la milliseconde et doit être précise à 5 µs (microsecondes). Toutefois, si le navigateur n'est pas en mesure de fournir une valeur temporelle précise à 5 microsecondes (en raison de contraintes matérielles ou logicielles, par exemple), il peut représenter la valeur comme un temps en millisecondes précis à la milliseconde près.

+ +

L'exemple de code suivant montre l'utilisation de DOMHighResTimeStamp et de la méthode Performance.now(). La méthode now() renvoie un timestamp (de type DOMHighResTimeStamp) qui est un point discret dans le temps. En appelant cette méthode avant et après une tâche, il est possible de mesurer le temps nécessaire à l'exécution de la tâche.

+ +
+function calculate_time() {
+  let startTime;
+  let endTime;
+
+  startTime = performance.now();
+  do_task();
+  endTime = performance.now();
+
+  return (endTime - startTime);
+}
+
+ +

Sérialisation de l'objet Performance

+ +

La sérialisation JSON de l'objet Performance est effectuée via la méthode toJSON(). Dans l'exemple suivant, la sérialisation JSON des objets Performance, Performance.timing {{deprecated_inline}} et Performance.navigation {{deprecated_inline}} est imprimée dans l'élément object.

+ +
+function print_json() {
+  let json;
+  let o = document.getElementsByTagName("output")[0];
+
+  if (window.performance.toJSON === undefined) {
+    json = "window.performance.toJSON() n'est PAS pris en charge";
+    o.innerHTML += json + "<br>";
+  } else {
+    let s;
+    json = window.performance.toJSON();
+
+    // Imprimer l'objet de performance
+    s = JSON.stringify(json);
+    o.innerHTML = "<p>performance = " + s + "</p>";
+
+    // Imprimer les objets performance.timing et performance.navigation
+    let perf = JSON.parse(s);
+
+    let timing = perf.timing;
+    o.innerHTML += "<p>peformance.timing = " + JSON.stringify(timing) + "</p>";
+
+    let navigation = perf.navigation;
+    o.innerHTML += "<p>peformance.navigation = " + JSON.stringify(navigation) + "</p>";
+  }
+}
+
+ +

Spécifications

+ +

Les interfaces décrites dans ce document sont définies dans la norme High Resolution Time qui comporte deux niveaux :

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Highres Time Level 2')}}{{Spec2('Highres Time Level 2')}}Ajout de l'attribut performance sur Window et WorkerGlobalScope.
{{SpecName('Highres Time')}}{{Spec2('Highres Time')}}Définition initiale.
+ +

Interopérabilité

+ +

Comme le montre le tableau des Compatibilités des navigateurs de l'interface Performance, la plupart des interfaces Performance sont largement implémentées par les navigateurs de bureau.

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performance_timeline/index.html b/files/fr/web/api/performance_timeline/index.html new file mode 100644 index 0000000000..0d6975484b --- /dev/null +++ b/files/fr/web/api/performance_timeline/index.html @@ -0,0 +1,80 @@ +--- +title: Performance Timeline API +slug: Web/API/Performance_Timeline +tags: + - API + - Guide + - Aperçu + - Performance + - Performance Web + - Overview + - Web Performance +translation_of: Web/API/Performance_Timeline +--- +
{{DefaultAPISidebar("Performance Timeline API")}}
+ +

L'API Performance Timeline définit des extensions de l'interface 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 en fonction de critères de filtrage spécifiques. La norme comprend également des interfaces qui permettent à une application de définir des retours (« callbacks ») d'observateur des performances, qui sont notifiés lorsque des événements de performance spécifiques sont ajoutés à la chronologie des performances du navigateur.

+ +

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.

+ +

{{AvailableInWorkers}}

+ +

Extensions de Performance

+ +

L'API Performance Timeline étend l'interface Performance avec trois méthodes qui fournissent différents mécanismes pour obtenir un ensemble d'enregistrements des performances (métriques), en fonction des critères de filtrage spécifiés. Ces méthodes sont les suivantes :

+ +
+
getEntries()
+
Renvoie toutes les entrées de performances enregistrées ou, éventuellement, les entrées basées sur les name, type de performance et/ou les initiatorType spécifiés. (tel qu'un élément HTML).
+
getEntriesByName()
+
Renvoie les entrées de performances enregistrées en fonction du name spécifié et éventuellement du type de performance.
+
getEntriesByType()
+
Renvoie les entrées de perfornances enregistrées en fonction des types de performances spécifiés.
+
+ +

L'interface PerformanceEntry

+ +

L'interface 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) :

+ +
+
name
+
Le nom de l'entrée de performance lorsque la métrique a été créée.
+
entryType
+
Le type de mesure de performance (par exemple, « mark »).
+
startTime
+
Un horodatage haute résolution représentant l'heure de départ de l'entrée de performance.
+
duration
+
Un horodatage haute résolution représentant la valeur temporelle de la durée de l'événement de performance (certains types d'entrée de performance n'ont pas de concept de durée et cette valeur est fixée à '0' pour ces types).
+
+ +

Cette interface comprend une méthode toJSON() qui renvoie la sérialisation de l'objet PerformanceEntry. La sérialisation varie selon le type de performance.

+ +

Observateurs des performances

+ +

{{SeeCompatTable}}

+ +

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.

+ +

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 qui contient uniquement des entrées de performance 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() de l'observateur a été invoquée. L'interface PerformanceObserverEntryList possède les trois mêmes méthodes getEntries*() que l'interface Performance. Cependant, notez qu'il y a une différence clé avec ces méthodes ; les versions PerformanceObserverEntryList sont utilisées pour récupérer les entrées de performance observées dans le rappel de l'observateur.

+ +

Outre la méthode observe() de l'interface PerformanceObserver (qui sert à enregistrer les types d'entrées pour observer), l'interface PerformanceObserver possède également une méthode disconnect() qui empêche un observateur de recevoir d'autres événements.

+ +

Les observateurs de performance ont été ajoutés au Niveau 2 de la norme et n'ont pas été implémentés à grande échelle.

+ +

État de la mise en œuvre

+ +

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.

+ + + +

Pour tester la prise en charge de ces interfaces par votre navigateur, vous pouvez exécuter l'application perf-api-support.

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performance_timeline/using_performance_timeline/index.html b/files/fr/web/api/performance_timeline/using_performance_timeline/index.html new file mode 100644 index 0000000000..d765a543c8 --- /dev/null +++ b/files/fr/web/api/performance_timeline/using_performance_timeline/index.html @@ -0,0 +1,221 @@ +--- +title: Utilisation de Performance Timeline +slug: Web/API/Performance_Timeline/Using_Performance_Timeline +tags: + - Guide + - Performance + - Performance Web + - Web Performance +translation_of: Web/API/Performance_Timeline/Using_Performance_Timeline +--- +
{{DefaultAPISidebar("Performance Timeline API")}}
+ +

La norme Performance Timeline définit des extensions de l'interface Performance pour prendre en charge les mesures de latence côté client au sein des applications. 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.

+ +

Extensions de Performance

+ +

Performance Timeline étend l'objet Performance avec trois méthodes qui fournissent différents mécanismes pour obtenir un ensemble d'enregistrements des performances (métriques), selon les critères de filtrage spécifiés. L'exemple suivant montre l'utilisation de ces méthodes getEntries(), getEntriesByName() et getEntriesByType().

+ +
+function log(s) {
+  let o = document.getElementsByTagName("output")[0];
+  o.innerHTML += s + " <br>";
+}
+function do_work(n) {
+  for (let i=0 ; i < n; i++) {
+      let m = Math.random();
+  }
+}
+function print_perf_entry(pe) {
+  log("..name: " + pe.name +
+      "; entryType: " + pe.entryType +
+      "; startTime: " + pe.startTime +
+      "; duration: " + pe.duration);
+}
+function print_PerformanceEntries() {
+  if (performance.mark === undefined) {
+    log("... performance.mark Not supported");
+    return;
+  }
+
+  // Crée quelques entrées de performance via les méthodes mark() et measure()
+  performance.mark("Begin");
+  do_work(50000);
+  performance.mark("End");
+  do_work(50000);
+  performance.measure("Measure1", "Begin", "End");
+
+  // Utilise getEntries() pour itérer toutes les entrées.
+  let p = performance.getEntries();
+  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 < 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 < 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 < p.length; i++) {
+    log ("Begin et Mark [" + i + "]");
+    print_perf_entry(p[i]);
+  }
+}
+
+ +

L'interface PerformanceEntry

+ +

L'interface 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(). L'exemple suivant montre l'utilisation de ces propriétés.

+ +
+function print_PerformanceEntry(ev) {
+  let properties = ["name", "entryType", "startTime", "duration"];
+
+  // Crée quelques entrées de performance
+  performance.mark("Start");
+  do_work(50000);
+  performance.mark("Stop");
+  performance.measure("measure-1");
+
+  let p = performance.getEntries();
+  for (let i=0; i < p.length; i++) {
+    log("PerfEntry[" + i + "]");
+    for (let =0; j < properties.length; j++) {
+      // check each property in window.performance
+      let supported = properties[j] in p[i];
+      if (supported) {
+        let pe = p[i];
+        log("... " + properties[j] + " = " + pe[properties[j]]);
+      } else {
+        log("... " + properties[j] + " = N'est pas pris en charge");
+      }
+    }
+  }
+}
+
+ +

Cette interface comprend également une méthode toJSON() qui renvoie la sérialisation de l'objet PerformanceEntry. Les exemples suivants montrent l'utilisation de cette méthode.

+ +
+function PerfEntry_toJSON() {
+
+  // Crée quelques entrées de performance
+  performance.mark("mark-1");
+  performance.mark("mark-2");
+  performance.measure("meas-1", "mark-1", "mark-2");
+
+  let peList = performance.getEntries();
+  let pe = peList[0];
+
+  if (pe.toJSON === undefined) {
+    log("PerformanceEntry.toJSON() n'est PAS pris en charge");
+    return;
+  }
+
+  // Imprime l'objet PerformanceEntry
+  let json = pe.toJSON();
+  let s = JSON.stringify(json);
+  log("PerformanceEntry.toJSON = " + s);
+}
+
+ +

Observateurs de performance

+ +

{{SeeCompatTable}}

+ +

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 qui contient uniquement des entrées de performance 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() de l'observateur a été invoquée.

+ +

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.

+ +
+function PerformanceObservers() {
+  // Crée un observateur pour tous les types d'événements de performance
+  let observe_all = new PerformanceObserver(function(list, obs) {
+    let perfEntries;
+
+    // Imprime toutes les entrées
+    perfEntries = list.getEntries();
+    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 < 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 < perfEntries.length; i++) {
+      print_perf_entry(perfEntries[i]);
+    }
+  });
+  // inscrit tous les types d'événements liés aux performances
+  observe_all.observe({entryTypes: ['frame', 'mark', 'measure', 'navigation', 'resource', 'server']});
+
+  // Crée un observateur pour le seul type d'événement "mark".
+  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 < perfEntries.length; i++) {
+      print_perf_entry(perfEntries[i]);
+    }
+  });
+  // inscrit uniquement l'événement "mark".
+  observe_mark.observe({entryTypes: ['mark']});
+}
+function print_perf_entry(pe) {
+  log("name: " + pe.name +
+      "; entryType: " + pe.entryType +
+      "; startTime: " + pe.startTime +
+      "; duration: " + pe.duration);
+}
+
+ +

L'interface liste des entrées de l'observateur de performance possède les trois mêmes méthodes getEntries*() que l'interface 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écificationStatutCommentaire
{{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

+ + diff --git a/files/fr/web/api/performanceelementtiming/element/index.html b/files/fr/web/api/performanceelementtiming/element/index.html new file mode 100644 index 0000000000..fc8b8119f5 --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/element/index.html @@ -0,0 +1,62 @@ +--- +title: PerformanceElementTiming.element +slug: Web/API/PerformanceElementTiming/element +tags: + - API + - Property + - Propriété + - Reference + - element + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming/element +--- +
{{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é.

+ +

Syntaxe

+ +
var element = PerformanceElementTiming.element;
+ +

Valeur

+

Un objet de type Element.

+ +

Exemples

+ +

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

+ +
<img src="image.jpg" alt="une belle image" elementtiming="big-image">
+ +
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"] });
+ +

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-element','PerformanceElementTiming.element')}}{{Spec2('Element Timing API')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceelementtiming/id/index.html b/files/fr/web/api/performanceelementtiming/id/index.html new file mode 100644 index 0000000000..36e2a07b92 --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/id/index.html @@ -0,0 +1,62 @@ +--- +title: PerformanceElementTiming.id +slug: Web/API/PerformanceElementTiming/id +tags: + - API + - Property + - Propriété + - Reference + - id + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming/id +--- +
{{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é.

+ +

Syntaxe

+ +
var id = PerformanceElementTiming.id;
+ +

Valeur

+

Une chaîne de caractères DOMString.

+ +

Exemples

+ +

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.

+ +
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+ +
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"] });
+ +

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.

+ +

Spécifications

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

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceelementtiming/identifier/index.html b/files/fr/web/api/performanceelementtiming/identifier/index.html new file mode 100644 index 0000000000..9c07117bb3 --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/identifier/index.html @@ -0,0 +1,62 @@ +--- +title: PerformanceElementTiming.identifier +slug: Web/API/PerformanceElementTiming/identifier +tags: + - API + - Property + - Propriété + - Reference + - identifier + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming/identifier +--- +
{{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.

+ +

Syntaxe

+ +
var identifier = PerformanceElementTiming.identifier;
+ +

Valeur

+

Une chaîne de caractères DOMString.

+ +

Examples

+ +

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

+ +
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+ +
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"] });
+ +

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.

+ +

Spécifications

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

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceelementtiming/index.html b/files/fr/web/api/performanceelementtiming/index.html new file mode 100644 index 0000000000..03a76a40a5 --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/index.html @@ -0,0 +1,82 @@ +--- +title: PerformanceElementTiming +slug: Web/API/PerformanceElementTiming +tags: + - API + - Interface + - Reference + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming +--- +
{{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.

+ +

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

Méthodes

+ +
+
PerformanceElementTiming.toJSON() {{Experimental_Inline}} {{Non-Standard_Inline}}
+
Génère une description JSON de l'objet.
+
+ +

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.

+ +

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>
+ +
const observer = new PerformanceObserver((list) => {
+  let entries = list.getEntries().forEach(function (entry) {
+      console.log(entry);
+  });
+});
+observer.observe({ entryTypes: ["element"] });
+ +

Spécifications

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

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceelementtiming/intersectionrect/index.html b/files/fr/web/api/performanceelementtiming/intersectionrect/index.html new file mode 100644 index 0000000000..b37c4e77ea --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/intersectionrect/index.html @@ -0,0 +1,64 @@ +--- +title: PerformanceElementTiming.intersectionRect +slug: Web/API/PerformanceElementTiming/intersectionRect +tags: + - API + - Property + - Propriété + - Reference + - intersectionRect + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming/intersectionRect +--- +
{{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).

+ +

Syntaxe

+ +
var rect = PerformanceElementTiming.intersectionRect;
+ +

Valeur

+

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

+ +

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.

+ +

Exemples

+ +

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

+ +
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+ +
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"] });
+ +

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-intersectionrect','PerformanceElementTiming.intersectionRect')}}{{Spec2('Element Timing API')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceelementtiming/loadtime/index.html b/files/fr/web/api/performanceelementtiming/loadtime/index.html new file mode 100644 index 0000000000..797edea2d3 --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/loadtime/index.html @@ -0,0 +1,62 @@ +--- +title: PerformanceElementTiming.loadTime +slug: Web/API/PerformanceElementTiming/loadTime +tags: + - API + - Property + - Propriété + - Reference + - loadTime + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming/loadTime +--- +
{{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.

+ +

Syntaxe

+ +
var loadTime = PerformanceElementTiming.loadTime;
+ +

Valeur

+

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

+ +

Exemples

+ +

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

+ +
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+ +
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"] });
+ +

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-loadtime','PerformanceElementTiming.loadTime')}}{{Spec2('Element Timing API')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceelementtiming/naturalheight/index.html b/files/fr/web/api/performanceelementtiming/naturalheight/index.html new file mode 100644 index 0000000000..ac66fb44ae --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/naturalheight/index.html @@ -0,0 +1,62 @@ +--- +title: PerformanceElementTiming.naturalHeight +slug: Web/API/PerformanceElementTiming/naturalHeight +tags: + - API + - Property + - Propriété + - Reference + - naturalHeight + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming/naturalHeight +--- +
{{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.

+ +

Syntaxe

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

+ +

Exemples

+ +

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.

+ +
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+ +
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"] });
+ +

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-naturalheight','PerformanceElementTiming.naturalHeight')}}{{Spec2('Element Timing API')}}Initial definition.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceelementtiming/naturalwidth/index.html b/files/fr/web/api/performanceelementtiming/naturalwidth/index.html new file mode 100644 index 0000000000..e284faba40 --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/naturalwidth/index.html @@ -0,0 +1,61 @@ +--- +title: PerformanceElementTiming.naturalWidth +slug: Web/API/PerformanceElementTiming/naturalWidth +tags: + - API + - Property + - Propriété + - Reference + - naturalWidth + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming/naturalWidth +--- +
{{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

+ +
var width = PerformanceElementTiming.naturalWidth;
+ +

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.

+ +

Exemples

+ +

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.

+ +
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+ +
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"] });
+ +

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")}}

diff --git a/files/fr/web/api/performanceelementtiming/rendertime/index.html b/files/fr/web/api/performanceelementtiming/rendertime/index.html new file mode 100644 index 0000000000..5e7d247e5a --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/rendertime/index.html @@ -0,0 +1,66 @@ +--- +title: PerformanceElementTiming.renderTime +slug: Web/API/PerformanceElementTiming/renderTime +tags: + - API + - Property + - Propriété + - Reference + - renderTime + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming/renderTime +--- +
{{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é.

+ +

Syntaxe

+ +
var renderTime = PerformanceElementTiming.renderTime;
+ +

Valeur

+

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

+ +

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.

+ +

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.

+ +

Exemples

+ +

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

+ +
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+ +
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"] });
+ +

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")}}

diff --git a/files/fr/web/api/performanceelementtiming/tojson/index.html b/files/fr/web/api/performanceelementtiming/tojson/index.html new file mode 100644 index 0000000000..6d0ff16b06 --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/tojson/index.html @@ -0,0 +1,66 @@ +--- +title: PerformanceElementTiming.toJSON() +slug: Web/API/PerformanceElementTiming/toJSON +tags: + - API + - Method + - Méthode + - Reference + - toJSON() + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming/toJSON +--- +
{{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.

+ +

Syntaxe

+ +
var json = PerformanceElementTiming.toJSON();
+ +

Valeur de retour

+ +
+
json
+
Un objet JSON qui est la sérialisation de l'objet PerformanceElementTiming.
+
+ +

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.

+ +
<img src="image.jpg" alt="une belle image" elementtiming="big-image" id="myImage">
+ +
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"] });
+ +

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-tojson','PerformanceElementTiming.toJson()')}}{{Spec2('Element Timing API')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceelementtiming/url/index.html b/files/fr/web/api/performanceelementtiming/url/index.html new file mode 100644 index 0000000000..ed02583ec0 --- /dev/null +++ b/files/fr/web/api/performanceelementtiming/url/index.html @@ -0,0 +1,62 @@ +--- +title: PerformanceElementTiming.url +slug: Web/API/PerformanceElementTiming/url +tags: + - API + - Property + - Propriété + - Reference + - url + - PerformanceElementTiming +translation_of: Web/API/PerformanceElementTiming/url +--- +
{{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.

+ +

Syntaxe

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

+ +

Exemples

+ +

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

+ +
<img src="https://example.com/image.jpg" alt="une belle imahe" elementtiming="big-image" id="myImage">
+ +
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"] });
+ +

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-url','PerformanceElementTiming.url')}}{{Spec2('Element Timing API')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceentry/duration/index.html b/files/fr/web/api/performanceentry/duration/index.html new file mode 100644 index 0000000000..14b9f3e4e7 --- /dev/null +++ b/files/fr/web/api/performanceentry/duration/index.html @@ -0,0 +1,120 @@ +--- +title: PerformanceEntry.duration +slug: Web/API/PerformanceEntry/duration +tags: + - API + - PerformanceEntry + - Property + - Propriété + - Reference + - Performance Web +translation_of: Web/API/PerformanceEntry/duration +--- +
{{APIRef("Performance Timeline API")}}
+ +

La propriété duration renvoie un timestamp qui correspond à la durée de l'entrée de performance.

+ +

{{AvailableInWorkers}}

+ +

La valeur retournée par cette propriété dépend du type de l'entrée de performance :

+ + + +

Cette propriété est en {{readonlyInline}}.

+ +

Syntaxe

+ +
entry.duration;
+ +

Valeur de retour

+ +

Un objet DOMHighResTimeStamp représentant la durée de l'entrée de performance. Si le concept de durée ne s'applique pas à une mesure de performance particulière, le navigateur peut choisir de renvoyer une durée de 0.

+ +
+

Note : si l'entrée de performance a un entryType "resource" (c'est-à-dire que l'entrée est un objet PerformanceResourceTiming), cette propriété renvoie la différence entre les timestamps PerformanceEntry.responseEnd et PerformanceEntry.startTime.

+
+ +

Exemple

+ +

L'exemple suivant montre l'utilisation de la propriété duration.

+ +
function run_PerformanceEntry() {
+  console.log("Support de PerformanceEntry ...");
+
+  if (performance.mark === undefined) {
+    console.log("... performance.mark N'est pas pris en charge");
+    return;
+  }
+
+  // Créer quelques entrées de performance via la méthode mark()
+  performance.mark("Begin");
+  do_work(50000);
+  performance.mark("End");
+
+  // Utilise getEntries() pour itérer à travers chaque entrée.
+  let p = performance.getEntries();
+  for (let i=0; i < p.length; i++) {
+    console.log("Entry[" + i + "]");
+    check_PerformanceEntry(p[i]);
+  }
+}
+function check_PerformanceEntry(obj) {
+  let properties = ["name", "entryType", "startTime", "duration"];
+  let methods = ["toJSON"];
+
+  for (let i=0; i < properties.length; i++) {
+    // check each property
+    let supported = properties[i] in obj;
+    if (supported)
+      console.log("..." + properties[i] + " = " + obj[properties[i]]);
+    else
+      console.log("..." + properties[i] + " = N'est pas pris en charge");
+  }
+  for (let i=0; i < methods.length; i++) {
+    // check each method
+    let supported = typeof obj[methods[i]] == "function";
+    if (supported) {
+      let js = obj[methods[i]]();
+      console.log("..." + methods[i] + "() = " + JSON.stringify(js));
+    } else {
+      console.log("..." + methods[i] + " = N'est pas pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', '#dom-performanceentry-duration', + 'duration')}}{{Spec2('Performance Timeline Level 2')}}
{{SpecName('Performance Timeline', '#dom-performanceentry-duration', + 'duration')}}{{Spec2('Performance Timeline')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceEntry.duration")}}

diff --git a/files/fr/web/api/performanceentry/entrytype/index.html b/files/fr/web/api/performanceentry/entrytype/index.html new file mode 100644 index 0000000000..f2223e82cd --- /dev/null +++ b/files/fr/web/api/performanceentry/entrytype/index.html @@ -0,0 +1,138 @@ +--- +title: PerformanceEntry.entryType +slug: Web/API/PerformanceEntry/entryType +tags: + - API + - Performance Timeline API + - PerformanceEntry + - Property + - Propriété + - Reference + - Performance Web +translation_of: Web/API/PerformanceEntry/entryType +--- +
{{APIRef("Performance Timeline API")}}
+ +

La propriété entryType renvoie un DOMString représentant le type de mesure de performance tel que, par exemple, « mark ». Cette propriété est en lecture seule.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
var type = entry.entryType;
+ +

Valeur de retour

+ +

La valeur de retour dépend du sous-type de l'objet PerformanceEntry et affecte la valeur de la propriété PerformanceEntry.name comme le montre le tableau ci-dessous.

+ +

Noms des types d'entrée de performance

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ValeurSous-typeType de propriété pour le nomDescription de la valeur du nom.
elementPerformanceElementTimingDOMStringRapporte le temps de chargement des éléments.
frame, navigationPerformanceFrameTiming, + PerformanceNavigationTimingURLL'adresse du document.
resourcePerformanceResourceTimingURLL'URL résolue de la ressource demandée. Cette valeur ne change pas même si la demande est redirigée.
markPerformanceMarkDOMStringLe nom utilisé lorsque la marque a été créée en appelant mark().
measurePerformanceMeasureDOMStringLe nom utilisé lorsque la mesure a été créée en appelant measure().
paintPerformancePaintTimingDOMStringSoit 'first-paint' ou 'first-contentful-paint'.
longtaskPerformanceLongTaskTimingDOMStringSignale les cas de tâches longues.
+ +

Exemple

+ +

L'exemple suivant montre l'utilisation de la propriété entryType.

+ +
function run_PerformanceEntry() {
+
+  // Vérifie le support des fonctionnalités avant de continuer
+  if (performance.mark === undefined) {
+    console.log("performance.mark n'est pas pris en charge");
+    return;
+  }
+
+  // Crée une entrée de performance nommée "begin" via la méthode mark()
+  performance.mark("begin");
+
+  // Vérifie le type d'entrée de toutes les entrées "begin".
+  let entriesNamedBegin = performance.getEntriesByName("begin");
+  for (let i=0; i < entriesNamedBegin.length; i++) {
+    let typeOfEntry = entriesNamedBegin[i].entryType;
+    console.log("L'entrée est de type : " + typeOfEntry);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', '#dom-performanceentry-entrytype', + 'entryType')}}{{Spec2('Performance Timeline Level 2')}}
{{SpecName('Performance Timeline', '#dom-performanceentry-entrytype', + 'entryType')}}{{Spec2('Performance Timeline')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceEntry.entryType")}}

diff --git a/files/fr/web/api/performanceentry/index.html b/files/fr/web/api/performanceentry/index.html new file mode 100644 index 0000000000..1e7ef376ea --- /dev/null +++ b/files/fr/web/api/performanceentry/index.html @@ -0,0 +1,147 @@ +--- +title: PerformanceEntry +slug: Web/API/PerformanceEntry +tags: + - API + - Interface + - Performance Timeline API + - PerformanceEntry + - Reference + - Performance Web +translation_of: Web/API/PerformanceEntry +--- +
{{APIRef("Performance Timeline API")}}
+ +

L'objet PerformanceEntry encapsule une seule mesure de performance qui fait partie de la chronologie de performance. Une entrée de performance peut être créée directement en faisant une marque ou une mesure (par exemple en appelant la méthode mark()) à un point explicite d'une application. Les entrées de performance sont également créées de manière indirecte, par exemple en chargeant une ressource (telle qu'une image).

+ +

Les instances PerformanceEntry auront toujours l'un des sous-types suivants :

+ + + +

{{AvailableInWorkers}}

+ +

Propriétés

+ +
+
PerformanceEntry.name {{readonlyInline}}
+
Une valeur qui précise davantage la valeur renvoyée par la propriété PerformanceEntry.entryType. La valeur des deux dépend du sous-type. Voir la page de la propriété pour les valeurs valides.
+
PerformanceEntry.entryType {{readonlyInline}}
+
Une chaîne de caractère DOMString représentant le type de mesure de performance comme, par exemple, "mark". Voir la page des propriétés pour les valeurs valides.
+
PerformanceEntry.startTime {{readonlyInline}}
+
Un objet DOMHighResTimeStamp représentant l'heure de départ de la mesure de performance.
+
PerformanceEntry.duration {{readonlyInline}}
+
Un objet DOMHighResTimeStamp représentant la valeur temporelle de la durée de l'événement de performance.
+
+ +

Méthodes

+ +
+
PerformanceEntry.toJSON()
+
Renvoie une représentation JSON de l'objet PerformanceEntry.
+
+ +

Exemple

+ +

L'exemple suivant vérifie toutes les propriétés PerformanceEntry pour voir si le navigateur les prend en charge et, le cas échéant, écrit leurs valeurs dans la console.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntries() pour obtenir une liste de toutes les entrées de performance.
+  let p = performance.getEntries();
+  for (let i = 0; i < p.length; i++) {
+    console.log("PerformanceEntry[" + i + "]");
+    print_PerformanceEntry(p[i]);
+  }
+}
+function print_PerformanceEntry(perfEntry) {
+  let properties = ["name",
+                    "entryType",
+                    "startTime",
+                    "duration"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // Vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " n'est PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing 3')}}{{Spec2('Resource Timing 3')}}
{{SpecName('Resource Timing 2')}}{{Spec2('Resource Timing 2')}}
{{SpecName('Resource Timing')}}{{Spec2('Resource Timing')}}Ajoute l'interface PerformanceResourceTiming et la valeur resource pour entryType.
{{SpecName('Navigation Timing Level 2')}}{{Spec2('Navigation Timing Level 2')}}
{{SpecName('Navigation Timing')}}{{Spec2('Navigation Timing')}}Ajoute l'interface PerformanceNavigationTiming et la valeur navigation pour entryType.
{{SpecName('User Timing Level 2')}}{{Spec2('User Timing Level 2')}}
{{SpecName('User Timing')}}{{Spec2('User Timing')}}Ajoute les interfaces PerformanceMark et PerformanceMeasure ainsi que les valeurs mark et measure pour entryType.
{{SpecName('Frame Timing')}}{{Spec2('Frame Timing')}}Ajoute l'interface PerformanceFrameTiming et la valeur frame pour entryType.
{{SpecName('Performance Timeline Level 2', '#dom-performanceentry', 'PerformanceEntry')}}{{Spec2('Performance Timeline Level 2')}}Ajout de la méthode de sérialisation toJSON().
{{SpecName('Performance Timeline', '#dom-performanceentry', 'PerformanceEntry')}}{{Spec2('Performance Timeline')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceentry/name/index.html b/files/fr/web/api/performanceentry/name/index.html new file mode 100644 index 0000000000..1683f51f51 --- /dev/null +++ b/files/fr/web/api/performanceentry/name/index.html @@ -0,0 +1,150 @@ +--- +title: PerformanceEntry.name +slug: Web/API/PerformanceEntry/name +tags: + - API + - Performance Timeline API + - PerformanceEntry + - Property + - Propriété + - Reference + - Performance Web +translation_of: Web/API/PerformanceEntry/name +--- +
{{APIRef("Performance Timeline API")}}
+ +

La propriété name de l'interface PerformanceEntry renvoie une valeur qui précise davantage la valeur renvoyée par la propriété PerformanceEntry.entryType. Cette propriété est en lecture seule.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
var name = entry.name;
+
+ +

Valeur de retour

+ +

La valeur de retour dépend du sous-type de l'objet PerformanceEntry et de la valeur de PerformanceEntry.entryType, comme le montre le tableau ci-dessous.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Type de valeur pour nameSous-typeType (entryType)Description
URLPerformanceFrameTiming, + PerformanceNavigationTimingframe, navigationL'adresse du document.
URLPerformanceResourceTimingresourceL'URL résolue de la ressource demandée. Cette valeur ne change pas même si la demande est redirigée.
DOMStringPerformanceMarkmarkLe nom utilisé lorsque le marqueur a été créé en appelant mark().
DOMStringPerformanceMeasuremeasureLe nom utilisé lorsque la mesure a été créée en appelant measure().
DOMStringPerformancePaintTimingpaintSoit 'first-paint' ou 'first-contentful-paint'.
+ +

Exemple

+ +

L'exemple suivant montre l'utilisation de la propriété name.

+ +
function run_PerformanceEntry() {
+  console.log("Support de PerformanceEntry ...");
+
+  if (performance.mark === undefined) {
+    console.log("... performance.mark n'est pas pris en charge");
+    return;
+  }
+
+  // Crée quelques entrées de performance via la méthode mark()
+  performance.mark("Begin");
+  do_work(50000);
+  performance.mark("End");
+
+  // Utilise getEntries() pour itérer à travers chaque entrée.
+  let p = performance.getEntries();
+  for (let i = 0; i < p.length; i++) {
+    console.log("Entry[" + i + "]");
+    check_PerformanceEntry(p[i]);
+  }
+}
+function check_PerformanceEntry(obj) {
+  let properties = ["name", "entryType", "startTime", "duration"];
+  let methods = ["toJSON"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // Vérifie chaque propriété
+    let supported = properties[i] in obj;
+    if (supported)
+      console.log("..." + properties[i] + " = " + obj[properties[i]]);
+    else
+      console.log("..." + properties[i] + " = Not supported");
+  }
+  for (let i = 0; i < methods.length; i++) {
+    // Vérifie chaque méthode
+    let supported = typeof obj[methods[i]] == "function";
+    if (supported) {
+      let js = obj[methods[i]]();
+      console.log("..." + methods[i] + "() = " + JSON.stringify(js));
+    } else {
+      console.log("..." + methods[i] + " = Not supported");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', '#dom-performanceentry-name', + 'name')}}{{Spec2('Performance Timeline Level 2')}}
{{SpecName('Performance Timeline', '#dom-performanceentry-name', + 'name')}}{{Spec2('Performance Timeline')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceEntry.name")}}

diff --git a/files/fr/web/api/performanceentry/starttime/index.html b/files/fr/web/api/performanceentry/starttime/index.html new file mode 100644 index 0000000000..864d4ac068 --- /dev/null +++ b/files/fr/web/api/performanceentry/starttime/index.html @@ -0,0 +1,122 @@ +--- +title: PerformanceEntry.startTime +slug: Web/API/PerformanceEntry/startTime +tags: + - API + - Performance Timeline API + - PerformanceEntry + - Property + - Propriété + - Reference + - Performance Web +translation_of: Web/API/PerformanceEntry/startTime +--- +
{{APIRef("Performance Timeline API")}}
+ +

La propriété startTime renvoie le premier timestamp enregistré pour l'entrée de performance.

+ +

{{AvailableInWorkers}}

+ +

La valeur renvoyée par cette propriété dépend du type de l'entrée de performance :

+ + + +

Cette propriété est en lecture seule.

+ +

Syntaxe

+ +
entry.startTime;
+ +

Valeur de retour

+ +

Un objet DOMHighResTimeStamp représentant le premier horodatage lorsque l'entrée de performance a été créée.

+ +
+

Note : Si l'entrée de performance a un entryType "resource" (c'est-à-dire que l'entrée est un objet PerformanceResourceTiming), cette propriété renvoie la valeur de l'horodatage fournie par PerformanceResourceTiming.fetchStart.

+
+ +

Exemple

+ +

L'exemple suivant montre l'utilisation de la propriété startTime.

+ +
function run_PerformanceEntry() {
+  console.log("Support de PerformanceEntry ...");
+
+  if (performance.mark === undefined) {
+    console.log("... performance.mark n'est pas pris en charge");
+    return;
+  }
+
+  // Crée quelques entrées de performance via la méthode mark()
+  performance.mark("Begin");
+  do_work(50000);
+  performance.mark("End");
+
+  // Utilise getEntries() pour itérer à travers chaque entrée
+  let p = performance.getEntries();
+  for (let i = 0; i < p.length; i++) {
+    log("Entry[" + i + "]");
+    check_PerformanceEntry(p[i]);
+  }
+}
+function check_PerformanceEntry(obj) {
+  let properties = ["name", "entryType", "startTime", "duration"];
+  let methods = ["toJSON"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // On vérifie chaque propriété
+    let supported = properties[i] in obj;
+    if (supported)
+      log("..." + properties[i] + " = " + obj[properties[i]]);
+    else
+      log("..." + properties[i] + " = N'est pas pris en charge");
+  }
+  for (let i = 0; i < methods.length; i++) {
+    // On vérifie chaque méthode
+    let supported = typeof obj[methods[i]] == "function";
+    if (supported) {
+      let js = obj[methods[i]]();
+      log("..." + methods[i] + "() = " + JSON.stringify(js));
+    } else {
+      log("..." + methods[i] + " = N'est pas pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', '#dom-performanceentry-starttime', + 'startTime')}}{{Spec2('Performance Timeline Level 2')}}
{{SpecName('Performance Timeline', '#dom-performanceentry-starttime', + 'startTime')}}{{Spec2('Performance Timeline')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceEntry.startTime")}}

diff --git a/files/fr/web/api/performanceentry/tojson/index.html b/files/fr/web/api/performanceentry/tojson/index.html new file mode 100644 index 0000000000..13a8c3bb5e --- /dev/null +++ b/files/fr/web/api/performanceentry/tojson/index.html @@ -0,0 +1,107 @@ +--- +title: PerformanceEntry.toJSON() +slug: Web/API/PerformanceEntry/toJSON +tags: + - API + - Method + - Méthode + - Performance Timeline API + - PerformanceEntry + - Reference + - Performance Web +translation_of: Web/API/PerformanceEntry/toJSON +--- +
{{APIRef("Performance Timeline API")}}
+ +

La méthode toJSON() permet de sérialiser l'objet PerformanceEntry courant et renvoie une représentation JSON de l'objet.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
let jsonObj = perfEntry.toJSON();
+
+ +

Arguments

+ +

Aucun.

+ +

Valeur de retour

+ +
+
json
+
Un objet JSON qui est la sérialisation de l'objet PerformanceEntry.
+
+ +

Exemple

+ +

L'exemple suivant montre l'utilisation de la méthode toJSON().

+ +
function run_PerformanceEntry() {
+  console.log("Support de PerformanceEntry ...");
+
+  if (performance.mark === undefined) {
+    console.log("... performance.mark n'est pas pris en charge");
+    return;
+  }
+
+  // Crée quelques entrées de performance via la méthode mark()
+  performance.mark("Begin");
+  do_work(50000);
+  performance.mark("End");
+
+  // Utilise getEntries() pour itérer à travers chaque entrée.
+  let p = performance.getEntries();
+  for (let i = 0; i < p.length; i++) {
+    console.log("Entry[" + i + "]");
+    check_PerformanceEntry(p[i]);
+  }
+}
+function check_PerformanceEntry(obj) {
+  let properties = ["name", "entryType", "startTime", "duration"];
+  let methods = ["toJSON"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // On vérifie chaque propriété
+    let supported = properties[i] in obj;
+    if (supported)
+      console.log("..." + properties[i] + " = " + obj[properties[i]]);
+    else
+      console.log("..." + properties[i] + " = N'est pas pris en charge");
+  }
+  for (let i = 0; i < methods.length; i++) {
+    // On vérifie chaque méthode
+    let supported = typeof obj[methods[i]] == "function";
+    if (supported) {
+      let js = obj[methods[i]]();
+      console.log("..." + methods[i] + "() = " + JSON.stringify(js));
+    } else {
+      console.log("..." + methods[i] + " = N'est pas pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', '#dom-performanceentry-tojson', + 'toJSON')}}{{Spec2('Performance Timeline Level 2')}}Définition initiale de la méthode toJSON().
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceeventtiming/index.html b/files/fr/web/api/performanceeventtiming/index.html new file mode 100644 index 0000000000..083b200b42 --- /dev/null +++ b/files/fr/web/api/performanceeventtiming/index.html @@ -0,0 +1,170 @@ +--- +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/performanceframetiming/index.html b/files/fr/web/api/performanceframetiming/index.html new file mode 100644 index 0000000000..118c7296ff --- /dev/null +++ b/files/fr/web/api/performanceframetiming/index.html @@ -0,0 +1,75 @@ +--- +title: PerformanceFrameTiming +slug: Web/API/PerformanceFrameTiming +tags: + - API + - Frame Timing API + - Interface + - Performance Timeline API + - PerformanceFrameTiming + - Reference + - Performance Web +translation_of: Web/API/PerformanceFrameTiming +--- +
{{SeeCompatTable}}{{APIRef("Frame Timing API")}}
+ +

PerformanceFrameTiming est une interface abstraite qui fournit des données d'horodatage de « frame » pour la boucle d'événements du navigateur. Une « frame » représente la quantité de travail qu'un navigateur effectue dans une itération de la boucle d'événements, comme le traitement des événements DOM, le redimensionnement, le défilement, le rendu, les animations CSS, etc. Un frame rate de 60fps (images par seconde) pour un taux de rafraîchissement de 60Hz est l'objectif pour une expérience utilisateur réactive. Cela signifie que le navigateur doit traiter une image en environ 16,7 ms.

+ +

Une application peut enregistrer un PerformanceObserver pour une « frame » de l'entrée de performance et l'observateur peut récupérer des données sur la durée de chaque événement. Ces informations peuvent être utilisées pour aider à identifier les choses qui consomment trop de temps pour offrir une bonne expérience utilisateur.

+ +

{{InheritanceDiagram}}

+ +

Propriétés

+ +

Cette interface n'a pas de propriétés mais elle étend les propriétés de PerformanceEntry suivantes (c'est-à-dire quand le type de l'entrée de performance vaut « frame ») en restreignant les propriétés comme suit :

+ +
+
PerformanceEntry.entryType
+
Retourne « frame ».
+
PerformanceEntry.name
+
Renvoie l'adresse du document.
+
PerformanceEntry.startTime
+
Retourne le timestamp (moment) où le cadre a été lancé.
+
PerformanceEntry.duration
+
Retourne un timestamp indiquant la différence entre le startTime de deux images successives.
+
+ +

Méthodes

+ +

Cette interface n'a pas de méthodes.

+ +

Exemple

+ +

Voir l'exemple dans l'article Utilisation de l'API Frame Timing.

+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Frame Timing', '#performanceframetiming-interface', 'PerformanceFrameTiming')}}{{Spec2('Frame Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancelongtasktiming/attribution/index.html b/files/fr/web/api/performancelongtasktiming/attribution/index.html new file mode 100644 index 0000000000..c3e9c82ff3 --- /dev/null +++ b/files/fr/web/api/performancelongtasktiming/attribution/index.html @@ -0,0 +1,46 @@ +--- +title: PerformanceLongTaskTiming.attribution +slug: Web/API/PerformanceLongTaskTiming/attribution +tags: + - API + - Long Tasks API + - PerformanceLongTaskTiming + - Property + - Propriété + - Reference +translation_of: Web/API/PerformanceLongTaskTiming/attribution +--- +

{{SeeCompatTable}}{{APIRef("Long Tasks")}}

+ +

La propriété en lecture seule attribution de l'interface PerformanceLongTaskTiming retourne une séquence d'instances TaskAttributionTiming.

+ +

Syntaxe

+ +
var taskAttributeTiming = PerformanceLongTaskTiming.attribution;
+ +

Valeur

+ +

Une séquence d'instances TaskAttributionTiming.

+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Long Tasks','#dom-performancelongtasktiming-attribution','attribution')}}{{Spec2('Long Tasks')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceLongTaskTiming.attribution")}}

diff --git a/files/fr/web/api/performancelongtasktiming/index.html b/files/fr/web/api/performancelongtasktiming/index.html new file mode 100644 index 0000000000..2066469ef5 --- /dev/null +++ b/files/fr/web/api/performancelongtasktiming/index.html @@ -0,0 +1,46 @@ +--- +title: PerformanceLongTaskTiming +slug: Web/API/PerformanceLongTaskTiming +tags: + - API + - Interface + - Long Tasks API + - PerformanceLongTaskTiming + - Reference +translation_of: Web/API/PerformanceLongTaskTiming +--- +

{{SeeCompatTable}}{{APIRef("Long Tasks")}}

+ +

L'interface PerformanceLongTaskTiming de l'API Long Tasks signale les instances de tâches longues.

+ +

{{InheritanceDiagram}}

+ +

Propriétés

+ +
+
PerformanceLongTaskTiming lecture seule {{ExperimentalBadge}}
+
Retourne une séquence d'instances TaskAttributionTiming.
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Long Tasks','#sec-PerformanceLongTaskTiming','PerformanceLongTaskTiming')}}{{Spec2('Long Tasks')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performancemark/index.html b/files/fr/web/api/performancemark/index.html new file mode 100644 index 0000000000..d258deec2b --- /dev/null +++ b/files/fr/web/api/performancemark/index.html @@ -0,0 +1,76 @@ +--- +title: PerformanceMark +slug: Web/API/PerformanceMark +tags: + - API + - Interface + - Performance Timing API + - Reference + - Performance Web +translation_of: Web/API/PerformanceMark +--- +
{{APIRef("User Timing API")}}
+ +

PerformanceMark est une interface abstraite pour les objets PerformanceEntry avec un entryType « mark ».Les entrées de ce type sont créées en appelant performance.mark() pour ajouter un DOMHighResTimeStamp nommé (le marqueur) à la chronologie des performances du navigateur.

+ +

{{InheritanceDiagram}}

+ +

{{AvailableInWorkers}}

+ +

Propriétés

+ +

Cette interface n'a pas de propriété mais elle étend les propriétés de PerformanceEntry suivantes en restreignant les propriétés comme suit :

+ +
+
PerformanceEntry.entryType
+
Retourne « mark ».
+
PerformanceEntry.name
+
Retourne le nom donné au marqueur lorsqu'il a été créé via un appel de performance.mark().
+
PerformanceEntry.startTime
+
Retourne le DOMHighResTimeStamp à partir du moment où performance.mark() a été appelé.
+
PerformanceEntry.duration
+
Retourne « 0 ». (Un marqueur n'a pas de durée.)
+
+ +

Méthodes

+ +

Cette interface n'a pas de méthodes.

+ +

Exemple

+ +

Voir l'exemple dans Utilisation de l'API User Timing.

+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('User Timing Level 2', '#performancemark', 'PerformanceMark')}}{{Spec2('User Timing Level 2')}}
{{SpecName('User Timing', '#performancemark', 'PerformanceMark')}}{{Spec2('User Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancemeasure/index.html b/files/fr/web/api/performancemeasure/index.html new file mode 100644 index 0000000000..4881a14b70 --- /dev/null +++ b/files/fr/web/api/performancemeasure/index.html @@ -0,0 +1,76 @@ +--- +title: PerformanceMeasure +slug: Web/API/PerformanceMeasure +tags: + - API + - Interface + - Performance Timeline API + - Reference + - Performance Web +translation_of: Web/API/PerformanceMeasure +--- +
{{APIRef("User Timing API")}}
+ +

PerformanceMeasure est une interface abstraite pour les objets PerformanceEntry ayant un entryType « measure ». Les entrées de ce type sont créées en appelant measure() pour ajouter un DOMHighResTimeStamp nommé (la mesure) entre deux marqueurs à la chronologie des performances du navigateur.

+ +

{{InheritanceDiagram}}

+ +

{{AvailableInWorkers}}

+ +

Propriétés

+ +

Cette interface n'a pas de propriété mais elle étend les propriétés de PerformanceEntry suivantes en restreignant les propriétés comme suit :

+ +
+
PerformanceEntry.entryType
+
Retourne « measure ».
+
PerformanceEntry.name
+
Retourne le nom donné à la mesure lorsqu'elle a été créée via un appel à performance.measure().
+
PerformanceEntry.startTime
+
Retourne un objet DOMHighResTimeStamp associé à la mesure indiquant le moment où performance.measure() a été appelée.
+
PerformanceEntry.duration
+
Retourne un objet DOMHighResTimeStamp correspondant à la durée de la mesure (généralement, l'horodatage de fin de la mesure moins l'horodatage de début).
+
+ +

Méthodes

+ +

Cette interface n'a pas de méthode.

+ +

Exemple

+ +

Voir l'exemple dans : Utilisation de l'API User Timing.

+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('User Timing Level 2', '#dom-performance-measure', 'PerformanceMeasure')}}{{Spec2('User Timing Level 2')}}
{{SpecName('User Timing', '#performancemeasure', 'PerformanceMeasure')}}{{Spec2('User Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancenavigation/index.html b/files/fr/web/api/performancenavigation/index.html new file mode 100644 index 0000000000..afb5a5d7d9 --- /dev/null +++ b/files/fr/web/api/performancenavigation/index.html @@ -0,0 +1,87 @@ +--- +title: PerformanceNavigation +slug: Web/API/PerformanceNavigation +tags: + - API + - Backwards compatibility + - Deprecated + - Déprécié + - Interface + - Navigation Timing + - Navigation Timing API + - Performance + - PerformanceNavigation + - Reference + - Timing +translation_of: Web/API/PerformanceNavigation +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne interface PerformanceNavigation représente des informations sur la façon dont la navigation vers le document actuel a été effectuée.

+ +

Un objet de ce type peut être obtenu en appelant l'attribut en lecture seule Performance.navigation.

+ +

Propriétés

+ +

L'interface PerformanceNavigation n'hérite d'aucune propriété.

+ +
+
PerformanceNavigation.type {{readonlyInline}} {{deprecated_inline}}
+
Une valeur unsigned short qui indique comment la navigation vers cette page s'est faite. Les valeurs possibles sont : +
+
TYPE_NAVIGATE (0)
+
La page a été consultée en suivant un lien, un signet, un formulaire ou un script, ou en tapant l'URL dans la barre d'adresse.
+
TYPE_RELOAD (1)
+
L'accès à la page s'est fait en cliquant sur le bouton Recharger ou via la méthode Location.reload().
+
TYPE_BACK_FORWARD (2)
+
On a accédé à cette page en naviguant dans l'historique.
+
TYPE_RESERVED (255)
+
De n'importe quelle autre manière.
+
+
+
PerformanceNavigation.redirectCount {{readonlyInline}} {{deprecated_inline}}
+
Un unsigned short représentant le nombre de Redirections effectués avant d'atteindre la page.
+
+ +

Méthodes

+ +

L'interface Performance n'hérite d'aucune méthode.

+ +
+
PerformanceNavigation.toJSON() {{deprecated_inline}}
+
Un sérialiseur renvoyant un objet json représentant l'objet PerformanceNavigation.
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationsStatutCommentaire
{{SpecName('Navigation Timing', '#performancenavigation', 'PerformanceNavigation')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancenavigation/redirectcount/index.html b/files/fr/web/api/performancenavigation/redirectcount/index.html new file mode 100644 index 0000000000..8316baaf34 --- /dev/null +++ b/files/fr/web/api/performancenavigation/redirectcount/index.html @@ -0,0 +1,58 @@ +--- +title: PerformanceNavigation.redirectCount +slug: Web/API/PerformanceNavigation/redirectCount +tags: + - API + - Backwards compatibility + - Deprecated + - Déprécié + - HTML + - Navigation Timing + - PerformanceNavigation + - Property + - Propriété + - Read-only + - Héritage +translation_of: Web/API/PerformanceNavigation/redirectCount +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser la propriété PerformanceNavigationTiming.redirectCount de l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule PerformanceNavigation.redirectCount renvoie un unsigned short représentant le nombre de Redirections effectués avant d'atteindre la page.

+ +

Syntaxe

+ +
let amount = performanceNavigation.redirectCount;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationsStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancenavigation-redirectcount', + 'PerformanceNavigation.redirectCount')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigation.redirectCount")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancenavigation/type/index.html b/files/fr/web/api/performancenavigation/type/index.html new file mode 100644 index 0000000000..14fc86b915 --- /dev/null +++ b/files/fr/web/api/performancenavigation/type/index.html @@ -0,0 +1,89 @@ +--- +title: PerformanceNavigation.type +slug: Web/API/PerformanceNavigation/type +tags: + - API + - Backwards compatibility + - Deprecated + - Déprécié + - Navigation Timing + - PerformanceNavigation + - Property + - Propriété + - Read-only + - Héritage +translation_of: Web/API/PerformanceNavigation/type +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser la propriété PerformanceNavigationTiming.type de l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété PerformanceNavigation.type en lecture seule renvoie un unsigned short contenant une constante décrivant comment la navigation vers cette page a été effectuée. Les valeurs possibles sont :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ValeurNom de la constanteSignification
0TYPE_NAVIGATELa page a été consultée en suivant un lien, un signet, un formulaire, un script ou en tapant l'URL dans la barre d'adresse.
1TYPE_RELOADLa page a été consultée en cliquant sur le bouton Recharger ou via la méthode Location.reload().
2TYPE_BACK_FORWARDLa page a été consultée en naviguant dans l'historique.
255TYPE_RESERVEDDe toute autre manière.
+ +

Syntaxe

+ +
let type = performanceNavigation.type;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationsStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancenavigation-type', + 'PerformanceNavigation.type')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigation.type")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancenavigationtiming/domcomplete/index.html b/files/fr/web/api/performancenavigationtiming/domcomplete/index.html new file mode 100644 index 0000000000..4a6d70c7ca --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/domcomplete/index.html @@ -0,0 +1,74 @@ +--- +title: PerformanceNavigationTiming.domComplete +slug: Web/API/PerformanceNavigationTiming/domComplete +tags: + - API + - Property + - Propriété + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/domComplete +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La propriété en lecture seule domComplete renvoie un timestamp représentant la valeur temporelle égale au temps immédiatement avant que l'agent utilisateur ne définisse la disponibilité du document actuel à complete.

+ +

Syntaxe

+ +
perfEntry.domComplete;
+ +

Valeur de retour

+ +

Un timestamp représentant une valeur temporelle égale au temps immédiatement avant que l'agent utilisateur ne définisse la disponibilité du document actuel à complete.

+ +

Exemple

+ +

L'exemple suivant illustre l'utilisation de cette propriété.

+ +
function print_nav_timing_data() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements de type "navigation".
+  let perfEntries = performance.getEntriesByType("navigation");
+
+  for (let i = 0; i < perfEntries.length; i++) {
+    console.log("= Entrée de navigation : entry[" + i + "]");
+    let p = perfEntries[i];
+    // propriétés du DOM
+    console.log("Contenu du DOM chargé = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart));
+    console.log("Contenu du DOM complet = " + p.domComplete);
+    console.log("Contenu du DOM interactif = " + p.interactive);
+
+    // temps de chargement et de déchargement des documents
+    console.log("Document chargé = " + (p.loadEventEnd - p.loadEventStart));
+    console.log("Document déchargé = " + (p.unloadEventEnd - p.unloadEventStart));
+
+    // autres propriétés
+    console.log("type = " + p.type);
+    console.log("redirectCount = " + p.redirectCount);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', + '#dom-performancenavigationtiming-domcomplete', 'domComplete')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigationTiming.domComplete")}}

diff --git a/files/fr/web/api/performancenavigationtiming/domcontentloadedeventend/index.html b/files/fr/web/api/performancenavigationtiming/domcontentloadedeventend/index.html new file mode 100644 index 0000000000..e9f37b8720 --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/domcontentloadedeventend/index.html @@ -0,0 +1,75 @@ +--- +title: PerformanceNavigationTiming.domContentLoadedEventEnd +slug: Web/API/PerformanceNavigationTiming/domContentLoadedEventEnd +tags: + - API + - Property + - Propriété + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/domContentLoadedEventEnd +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La propriété en lecture seule domContentLoadedEventEnd retourne un timestamp représentant la valeur temporelle égale au temps immédiatement après la fin de l'événement DOMContentLoaded du document actuel.

+ +

Syntaxe

+ +
perfEntry.domContentLoadedEventEnd;
+ +

Valeur de retour

+ +

Un timestamp représentant la valeur temporelle égale au temps immédiatement après la fin de l'événement DOMContentLoaded du document actuel.

+ +

Exemple

+ +

L'exemple suivant illustre l'utilisation de cette propriété.

+ +
function print_nav_timing_data() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements de type "navigation".
+  let perfEntries = performance.getEntriesByType("navigation");
+
+  for (let i = 0; i < perfEntries.length; i++) {
+    console.log("= Entrée de navigation : entry[" + i + "]");
+    let p = perfEntries[i];
+    // propriétés du DOM
+    console.log("Contenu du DOM chargé = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart));
+    console.log("Contenu du DOM complet = " + p.domComplete);
+    console.log("Contenu du DOM interactif = " + p.interactive);
+
+    // temps de chargement et de déchargement des documents
+    console.log("Document chargé = " + (p.loadEventEnd - p.loadEventStart));
+    console.log("Document déchargé = " + (p.unloadEventEnd - p.unloadEventStart));
+
+    // autres propriétés
+    console.log("type = " + p.type);
+    console.log("redirectCount = " + p.redirectCount);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', + '#dom-performancenavigationtiming-domcontentloadedeventend', + 'domContentLoadedEventEnd')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigationTiming.domContentLoadedEventEnd")}}

diff --git a/files/fr/web/api/performancenavigationtiming/domcontentloadedeventstart/index.html b/files/fr/web/api/performancenavigationtiming/domcontentloadedeventstart/index.html new file mode 100644 index 0000000000..88e1459fbb --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/domcontentloadedeventstart/index.html @@ -0,0 +1,75 @@ +--- +title: PerformanceNavigationTiming.domContentLoadedEventStart +slug: Web/API/PerformanceNavigationTiming/domContentLoadedEventStart +tags: + - API + - Property + - Propriété + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/domContentLoadedEventStart +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La propriété en lecture seule domContentLoadedEventStart retourne un timestamp représentant la valeur temporelle égale au temps immédiatement avant que l'agent utilisateur ne déclenche l'événement DOMContentLoaded du document actuel.

+ +

Syntaxe

+ +
perfEntry.domContentLoadedEventStart;
+ +

Valeur de retour

+ +

Un timestamp représentant la valeur temporelle égale au temps immédiatement avant que l'agent utilisateur ne déclenche l'événement DOMContentLoaded du document actuel.

+ +

Exemple

+ +

L'exemple suivant illustre l'utilisation de cette propriété.

+ +
function print_nav_timing_data() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements de type "navigation".
+  let perfEntries = performance.getEntriesByType("navigation");
+
+  for (let i = 0; i < perfEntries.length; i++) {
+    console.log("= Entrée de navigation : entry[" + i + "]");
+    let p = perfEntries[i];
+    // propriétés du DOM
+    console.log("Contenu du DOM chargé = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart));
+    console.log("Contenu du DOM complet = " + p.domComplete);
+    console.log("Contenu du DOM interactif = " + p.interactive);
+
+    // temps de chargement et de déchargement des documents
+    console.log("Document chargé = " + (p.loadEventEnd - p.loadEventStart));
+    console.log("Document déchargé = " + (p.unloadEventEnd - p.unloadEventStart));
+
+    // autres propriétés
+    console.log("type = " + p.type);
+    console.log("redirectCount = " + p.redirectCount);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', + '#dom-performancenavigationtiming-domcontentloadedeventstart', + 'domContentLoadedEventStart')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigationTiming.domContentLoadedEventStart")}}

diff --git a/files/fr/web/api/performancenavigationtiming/dominteractive/index.html b/files/fr/web/api/performancenavigationtiming/dominteractive/index.html new file mode 100644 index 0000000000..88045fd7d9 --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/dominteractive/index.html @@ -0,0 +1,74 @@ +--- +title: PerformanceNavigationTiming.domInteractive +slug: Web/API/PerformanceNavigationTiming/domInteractive +tags: + - API + - Property + - Propriété + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/domInteractive +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La propriété en lecture seule domInteractive retourne un timestamp représentant la valeur temporelle égale au temps immédiatement avant que l'agent utilisateur ne définisse la disponibilité du document actuel à interactif.

+ +

Syntaxe

+ +
perfEntry.domInteractive;
+ +

Valeur de retour

+ +

Une timestamp représentant la valeur temporelle égale au temps immédiatement avant que l'agent utilisateur ne définisse la disponibilité du document actuel à interactif.

+ +

Exemple

+ +

L'exemple suivant illustre l'utilisation de cette propriété.

+ +
function print_nav_timing_data() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements de type "navigation".
+  let perfEntries = performance.getEntriesByType("navigation");
+
+  for (let i =0; i < perfEntries.length; i++) {
+    console.log("= Entrée de navigation : entry[" + i + "]");
+    let p = perfEntries[i];
+    // propriétés du DOM
+    console.log("Contenu du DOM chargé = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart));
+    console.log("Contenu du DOM complet = " + p.domComplete);
+    console.log("Contenu du DOM interactif = " + p.interactive);
+
+    // temps de chargement et de déchargement des documents
+    console.log("Document chargé = " + (p.loadEventEnd - p.loadEventStart));
+    console.log("Document déchargé = " + (p.unloadEventEnd - p.unloadEventStart));
+
+    // autres propriétés
+    console.log("type = " + p.type);
+    console.log("redirectCount = " + p.redirectCount);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', + '#dom-performancenavigationtiming-dominteractive', 'domInteractive')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigationTiming.domInteractive")}}

diff --git a/files/fr/web/api/performancenavigationtiming/index.html b/files/fr/web/api/performancenavigationtiming/index.html new file mode 100644 index 0000000000..bb1fdb48d1 --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/index.html @@ -0,0 +1,106 @@ +--- +title: PerformanceNavigationTiming +slug: Web/API/PerformanceNavigationTiming +tags: + - API + - Interface + - Navigation Timing API + - Performance Timeline API + - Reference + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming +--- +

{{APIRef("Navigation Timing")}}{{SeeCompatTable}}

+ +

L'interface PerformanceNavigationTiming fournit des méthodes et des propriétés pour stocker et récupérer des métriques concernant les événements de navigation de document du navigateur. Par exemple, cette interface peut être utilisée pour déterminer le temps nécessaire au chargement ou au déchargement d'un document.

+ +

{{InheritanceDiagram}}

+ +

Propriétés

+ +

Cette interface étend les propriétés de PerformanceEntry suivantes pour les types d'entrée de performance de navigation en les qualifiant et en les contraignant comme suit :

+ +
+
PerformanceEntry.entryType {{readonlyInline}}
+
Retourne « navigation ».
+
PerformanceEntry.name {{readonlyInline}}
+
Retourne l'adresse du document.
+
PerformanceEntry.startTime {{readonlyInline}}
+
Retourne un DOMHighResTimeStamp avec une valeur de « 0 ».
+
PerformanceEntry.duration {{readonlyInline}}
+
Retourne un timestamp qui est la différence entre les propriétés PerformanceNavigationTiming.loadEventEnd et PerformanceEntry.startTime.
+
+ +

Cette interface étend également les propriétés PerformanceResourceTiming suivantes pour les types d'entrée de performance de navigation en les qualifiant et en les contraignant comme suit :

+ +
+
PerformanceResourceTiming.initiatorType {{readonlyInline}}
+
Retourne « navigation ».
+
+ +

L'interface prend également en charge les propriétés suivantes :

+ +
+
PerformanceNavigationTiming.domComplete {{readonlyInline}} {{Experimental_Inline}}
+
Un DOMHighResTimeStamp représentant une valeur temporelle égale au temps immédiatement avant que le navigateur ne définisse la disponibilité du document actuel à complete.
+
PerformanceNavigationTiming.domContentLoadedEventEnd {{readonlyInline}} {{Experimental_Inline}}
+
Un DOMHighResTimeStamp représentant la valeur temporelle égale au temps immédiatement après la fin de l'événement DOMContentLoaded du document actuel.
+
PerformanceNavigationTiming.domContentLoadedEventStart {{readonlyInline}} {{Experimental_Inline}}
+
Un DOMHighResTimeStamp représentant la valeur temporelle égale au temps immédiatement avant que l'agent utilisateur ne déclenche l'événement DOMContentLoaded sur le document actuel.
+
PerformanceNavigationTiming.domInteractive {{readonlyInline}} {{Experimental_Inline}}
+
Un DOMHighResTimeStamp représentant une valeur temporelle égale qui précède immédiatement le moment où l'agent utilisateur règle l'état de préparation du document actuel sur interactif.
+
PerformanceNavigationTiming.loadEventEnd {{readonlyInline}} {{Experimental_Inline}}
+
Un DOMHighResTimeStamp représentant le moment où l'événement de chargement du document actuel est terminé.
+
PerformanceNavigationTiming.loadEventStart {{readonlyInline}} {{Experimental_Inline}}
+
Un DOMHighResTimeStamp représentant la valeur temporelle égale à l'heure précédant immédiatement l'événement de chargement du document actuel.
+
PerformanceNavigationTiming.redirectCount {{readonlyInline}} {{Experimental_Inline}}
+
Un nombre représentant le nombre de redirections, depuis la dernière navigation sans redirection, dans le contexte de navigation actuel.
+
S'il n'y a pas eu de redirection, ou si la redirection provenait d'une autre origine, et que cette origine ne permet pas que ses informations temporelles soient exposées à l'origine actuelle, la valeur sera 0.
+
PerformanceNavigationTiming.requestStart {{readonlyInline}} {{Experimental_Inline}}
+
Un DOMHighResTimeStamp représentant le moment immédiatement avant que l'agent utilisateur ne commence à demander la ressource au serveur, ou aux caches d'application pertinents ou aux ressources locales.
+
PerformanceNavigationTiming.responseStart {{readonlyInline}} {{Experimental_Inline}}
+
Un DOMHighResTimeStamp représentant l'heure immédiatement après que l'analyseur HTTP de l'agent utilisateur ait reçu le premier octet de la réponse des caches d'application pertinents, ou des ressources locales ou du serveur.
+
PerformanceNavigationTiming.type {{readonlyInline}} {{Experimental_Inline}}
+
Une chaîne de caractère DOMString représentant le type de navigation. Doit être : « navigate », « reload », « back_forward » ou « prerender ».
+
PerformanceNavigationTiming.unloadEventEnd {{readonlyInline}} {{Experimental_Inline}}
+
Un DOMHighResTimeStamp représentant la valeur temporelle égale au temps immédiatement après que l'agent utilisateur ait terminé l'événement de déchargement du document précédent.
+
PerformanceNavigationTiming.unloadEventStart {{readonlyInline}} {{Experimental_Inline}}
+
Un DOMHighResTimeStamp représentant la valeur temporelle égale au temps immédiatement avant que l'agent utilisateur ne lance l'événement de déchargement du document précédent.
+
+ +

Méthodes

+ +
+
PerformanceNavigationTiming.toJSON() {{Experimental_Inline}}
+
Retourne une chaîne de caractères DOMString qui est la représentation JSON de l'objet PerformanceNavigationTiming.
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationsStatutCommentaire
{{SpecName('Navigation Timing Level 2', '#sec-PerformanceNavigationTiming', 'PerformanceNavigationTiming')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancenavigationtiming/loadeventend/index.html b/files/fr/web/api/performancenavigationtiming/loadeventend/index.html new file mode 100644 index 0000000000..58b2490f45 --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/loadeventend/index.html @@ -0,0 +1,74 @@ +--- +title: PerformanceNavigationTiming.loadEventEnd +slug: Web/API/PerformanceNavigationTiming/loadEventEnd +tags: + - API + - Property + - Propriété + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/loadEventEnd +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La propriété en lecture seule loadEventEnd renvoie un timestamp qui est égal à l'heure à laquelle l'événement de chargement du document actuel est terminé.

+ +

Syntaxe

+ +
perfEntry.loadEventEnd;
+ +

Valeur de retour

+ +

Un timestamp représentant le moment où l'événement de chargement du document actuel est terminé.

+ +

Exemple

+ +

L'exemple suivant illustre l'utilisation de cette propriété.

+ +
function print_nav_timing_data() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements de type "navigation".
+  let perfEntries = performance.getEntriesByType("navigation");
+
+  for (let i = 0; i < perfEntries.length; i++) {
+    console.log("= Entrée de navigation : entry[" + i + "]");
+    let p = perfEntries[i];
+    // propriétés du DOM
+    console.log("Contenu du DOM chargé = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart));
+    console.log("Contenu du DOM complet = " + p.domComplete);
+    console.log("Contenu du DOM interactif = " + p.interactive);
+
+    // temps de chargement et de déchargement des documents
+    console.log("Document chargé = " + (p.loadEventEnd - p.loadEventStart));
+    console.log("Document déchargé = " + (p.unloadEventEnd - p.unloadEventStart));
+
+    // autres propriétés
+    console.log("type = " + p.type);
+    console.log("redirectCount = " + p.redirectCount);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', + '#dom-performancenavigationtiming-loadeventend', 'loadEventEnd')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigationTiming.loadEventEnd")}}

diff --git a/files/fr/web/api/performancenavigationtiming/loadeventstart/index.html b/files/fr/web/api/performancenavigationtiming/loadeventstart/index.html new file mode 100644 index 0000000000..910b29c044 --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/loadeventstart/index.html @@ -0,0 +1,74 @@ +--- +title: PerformanceNavigationTiming.loadEventStart +slug: Web/API/PerformanceNavigationTiming/loadEventStart +tags: + - API + - Property + - Propriété + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/loadEventStart +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La propriété en lecture seule loadEventStart retourne un timestamp représentant la valeur temporelle égale au temps immédiatement avant le déclenchement de l'événement de chargement du document actuel.

+ +

Syntaxe

+ +
perfEntry.loadEventStart;
+ +

Valeur de retour

+ +

Un timestamp représentant une valeur temporelle égale à l'heure précédant immédiatement l'événement de chargement du document actuel.

+ +

Exemple

+ +

L'exemple suivant illustre l'utilisation de cette propriété.

+ +
function print_nav_timing_data() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements de type "navigation".
+  let perfEntries = performance.getEntriesByType("navigation");
+
+  for (let i = 0; i < perfEntries.length; i++) {
+    console.log("= Entrée de navigation : entry[" + i + "]");
+    let p = perfEntries[i];
+    // propriétés du DOM
+    console.log("Contenu du DOM chargé = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart));
+    console.log("Contenu du DOM complet = " + p.domComplete);
+    console.log("Contenu du DOM interactif = " + p.interactive);
+
+    // temps de chargement et de déchargement des documents
+    console.log("Document chargé = " + (p.loadEventEnd - p.loadEventStart));
+    console.log("Document déchargé = " + (p.unloadEventEnd - p.unloadEventStart));
+
+    // autres propriétés
+    console.log("type = " + p.type);
+    console.log("redirectCount = " + p.redirectCount);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', + '#dom-performancenavigationtiming-loadeventstart', 'loadEventStart')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigationTiming.loadEventStart")}}

diff --git a/files/fr/web/api/performancenavigationtiming/redirectcount/index.html b/files/fr/web/api/performancenavigationtiming/redirectcount/index.html new file mode 100644 index 0000000000..5c17f209f2 --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/redirectcount/index.html @@ -0,0 +1,74 @@ +--- +title: PerformanceNavigationTiming.redirectCount +slug: Web/API/PerformanceNavigationTiming/redirectCount +tags: + - API + - Property + - Propriété + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/redirectCount +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La propriété en lecture seule redirectCount renvoie un timestamp représentant le nombre de redirections depuis la dernière navigation sans redirection dans le contexte de navigation actuel.

+ +

Syntaxe

+ +
perfEntry.redirectCount;
+ +

Valeur de retour

+ +

Un nombre représentant le nombre de redirections depuis la dernière navigation sans redirection dans le contexte de navigation actuel.

+ +

Exemple

+ +

L'exemple suivant illustre l'utilisation de cette propriété.

+ +
function print_nav_timing_data() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements de type "navigation".
+  let perfEntries = performance.getEntriesByType("navigation");
+
+  for (let i = 0; i < perfEntries.length; i++) {
+    console.log("= Entrée de navigation : entry[" + i + "]");
+    let p = perfEntries[i];
+    // propriétés du DOM
+    console.log("Contenu du DOM chargé = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart));
+    console.log("Contenu du DOM complet = " + p.domComplete);
+    console.log("Contenu du DOM interactif = " + p.interactive);
+
+    // temps de chargement et de déchargement des documents
+    console.log("Document chargé = " + (p.loadEventEnd - p.loadEventStart));
+    console.log("Document déchargé = " + (p.unloadEventEnd - p.unloadEventStart));
+
+    // autres propriétés
+    console.log("type = " + p.type);
+    console.log("redirectCount = " + p.redirectCount);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', + '#dom-performancenavigationtiming-redirectcount', 'redirectCount')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigationTiming.redirectCount")}}

diff --git a/files/fr/web/api/performancenavigationtiming/tojson/index.html b/files/fr/web/api/performancenavigationtiming/tojson/index.html new file mode 100644 index 0000000000..8ca2ec6289 --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/tojson/index.html @@ -0,0 +1,66 @@ +--- +title: PerformanceNavigationTiming.toJSON() +slug: Web/API/PerformanceNavigationTiming/toJSON +tags: + - API + - Method + - Méthode + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/toJSON +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La méthode toJSON() est un sérialiseur - elle renvoie une représentation JSON de l'objet PerformanceNavigationTiming.

+ +

Syntaxe

+ +
const json = resourcePerfEntry.toJSON();
+ +

Arguments

+ +

Aucun.

+ +

Valeur de retour

+ +
+
json
+
Un objet JSON qui est la sérialisation de l'objet PerformanceNavigationTiming comme une carte avec des entrées de l'interface héritée la plus proche et avec des entrées pour chacun des attributs sérialisables.
+
+ +

Exemple

+ +
// Obtient une entrée de performance des ressources
+let perfEntries = performance.getEntriesByType("navigation");
+let entry = perfEntries[0];
+
+// Récupère le JSON et l'affiche dans les journaux
+let json = entry.toJSON();
+let s = JSON.stringify(json);
+console.log("PerformanceNavigationTiming.toJSON() = " + s);
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', + '#dom-performancenavigationtiming-tojson', 'toJSON()')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performancenavigationtiming/type/index.html b/files/fr/web/api/performancenavigationtiming/type/index.html new file mode 100644 index 0000000000..4c0d9dcb12 --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/type/index.html @@ -0,0 +1,85 @@ +--- +title: PerformanceNavigationTiming.type +slug: Web/API/PerformanceNavigationTiming/type +tags: + - API + - Property + - Propriété + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/type +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La propriété en lecture seule type renvoie une chaîne de caractères DOMString représentant le type de navigation. La valeur doit être l'une des suivantes :

+ +
+
navigate
+
La navigation a commencé en cliquant sur un lien, en saisissant l'URL dans la barre d'adresse du navigateur, en soumettant un formulaire ou en s'initialisant par une opération de script autre que reload et back_forward, comme indiqué ci-dessous.
+
reload
+
La navigation s'effectue par l'opération de rechargement du navigateur ou location.reload().
+
back_forward
+
La navigation se fait par l'opération de traversée de l'historique du navigateur.
+
prerender
+
La navigation est initiée par un indice de prétraitement.
+
+ +

Syntaxe

+ +
perfEntry.type;
+ +

Valeur de retour

+ +

Une chaîne de caractères DOMString qui est l'une des valeurs énumérées ci-dessus.

+ +

Exemple

+ +

L'exemple suivant illustre l'utilisation de cette propriété.

+ +
function print_nav_timing_data() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements de type "navigation".
+  let perfEntries = performance.getEntriesByType("navigation");
+
+  for (let i = 0; i < perfEntries.length; i++) {
+    console.log("= Entrée de navigation : entry[" + i + "]");
+    let p = perfEntries[i];
+    // propriétés du DOM
+    console.log("Contenu du DOM chargé = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart));
+    console.log("Contenu du DOM complet = " + p.domComplete);
+    console.log("Contenu du DOM interactif = " + p.interactive);
+
+    // temps de chargement et de déchargement des documents
+    console.log("Document chargé = " + (p.loadEventEnd - p.loadEventStart));
+    console.log("Document déchargé = " + (p.unloadEventEnd - p.unloadEventStart));
+
+    // autres propriétés
+    console.log("type = " + p.type);
+    console.log("redirectCount = " + p.redirectCount);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', '#dom-performancenavigationtiming-type', + 'type')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigationTiming.type")}}

diff --git a/files/fr/web/api/performancenavigationtiming/unloadeventend/index.html b/files/fr/web/api/performancenavigationtiming/unloadeventend/index.html new file mode 100644 index 0000000000..c1625c81d2 --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/unloadeventend/index.html @@ -0,0 +1,74 @@ +--- +title: PerformanceNavigationTiming.unloadEventEnd +slug: Web/API/PerformanceNavigationTiming/unloadEventEnd +tags: + - API + - Property + - Propriété + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/unloadEventEnd +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La propriété unloadEventEnd en lecture seule retourne un timestamp représentant la valeur temporelle égale au temps immédiatement après la fin de l'événement de déchargement du document précédent par l'agent utilisateur. S'il n'y a pas de document précédent, la valeur de cette propriété est 0.

+ +

Syntaxe

+ +
perfEntry.unloadEventEnd;
+ +

Valeur de retour

+ +

Un timestamp représentant une valeur temporelle égale au temps immédiatement après que l'agent utilisateur ait terminé l'événement de déchargement du document précédent.

+ +

Exemple

+ +

L'exemple suivant illustre l'utilisation de cette propriété.

+ +
function print_nav_timing_data() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements de type "navigation".
+  let perfEntries = performance.getEntriesByType("navigation");
+
+  for (let i = 0; i < perfEntries.length; i++) {
+    console.log("= Entrée de navigation : entry[" + i + "]");
+    let p = perfEntries[i];
+    // propriétés du DOM
+    console.log("Contenu du DOM chargé = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart));
+    console.log("Contenu du DOM complet = " + p.domComplete);
+    console.log("Contenu du DOM interactif = " + p.interactive);
+
+    // temps de chargement et de déchargement des documents
+    console.log("Document chargé = " + (p.loadEventEnd - p.loadEventStart));
+    console.log("Document déchargé = " + (p.unloadEventEnd - p.unloadEventStart));
+
+    // autres propriétés
+    console.log("type = " + p.type);
+    console.log("redirectCount = " + p.redirectCount);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', + '#dom-performancenavigationtiming-unloadeventend', 'unloadEventEnd')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigationTiming.unloadEventEnd")}}

diff --git a/files/fr/web/api/performancenavigationtiming/unloadeventstart/index.html b/files/fr/web/api/performancenavigationtiming/unloadeventstart/index.html new file mode 100644 index 0000000000..f4b7ceabba --- /dev/null +++ b/files/fr/web/api/performancenavigationtiming/unloadeventstart/index.html @@ -0,0 +1,74 @@ +--- +title: PerformanceNavigationTiming.unloadEventStart +slug: Web/API/PerformanceNavigationTiming/unloadEventStart +tags: + - API + - Property + - Propriété + - Reference + - PerformanceNavigationTiming + - Performance Web +translation_of: Web/API/PerformanceNavigationTiming/unloadEventStart +--- +
{{APIRef("Navigation Timing")}}{{SeeCompatTable}}
+ +

La propriété en lecture seule unloadEventStart renvoie un timestamp représentant la valeur temporelle égale au temps immédiatement avant que l'agent utilisateur ne commence l'événement de déchargement du document précédent. S'il n'y a pas de document précédent, cette propriété renvoie 0.

+ +

Syntaxe

+ +
perfEntry.unloadEventStart;
+ +

Valeur de retour

+ +

Un timestamp représentant la valeur temporelle égale au temps immédiatement avant que l'agent utilisateur ne lance l'événement de déchargement du document précédent.

+ +

Exemple

+ +

L'exemple suivant illustre l'utilisation de cette propriété.

+ +
function print_nav_timing_data() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements de type "navigation".
+  let perfEntries = performance.getEntriesByType("navigation");
+
+  for (let i = 0; i < perfEntries.length; i++) {
+    console.log("= Entrée de navigation : entry[" + i + "]");
+    let p = perfEntries[i];
+    // propriétés du DOM
+    console.log("Contenu du DOM chargé = " + (p.domContentLoadedEventEnd - p.domContentLoadedEventStart));
+    console.log("Contenu du DOM complet = " + p.domComplete);
+    console.log("Contenu du DOM interactif = " + p.interactive);
+
+    // temps de chargement et de déchargement des documents
+    console.log("Document chargé = " + (p.loadEventEnd - p.loadEventStart));
+    console.log("Document déchargé = " + (p.unloadEventEnd - p.unloadEventStart));
+
+    // autres propriétés
+    console.log("type = " + p.type);
+    console.log("redirectCount = " + p.redirectCount);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing Level 2', + '#dom-performancenavigationtiming-unloadeventstart', 'unloadEventStart')}}{{Spec2('Navigation Timing Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceNavigationTiming.unloadEventStart")}}

diff --git a/files/fr/web/api/performanceobserver/disconnect/index.html b/files/fr/web/api/performanceobserver/disconnect/index.html new file mode 100644 index 0000000000..d4e509708b --- /dev/null +++ b/files/fr/web/api/performanceobserver/disconnect/index.html @@ -0,0 +1,66 @@ +--- +title: PeformanceObserver.disconnect() +slug: Web/API/PerformanceObserver/disconnect +tags: + - API + - Method + - Méthode + - Performance Observer API + - PerformanceObserver + - Reference + - Performance Web + - disconnect() + - observers +translation_of: Web/API/PerformanceObserver/disconnect +--- +
{{APIRef("Performance Timeline API")}}
+ +

La méthode disconnect() de l'interface PerformanceObserver est utilisée pour empêcher l'observateur de performances de recevoir tout événement d'entrée de performance.

+ +

Syntaxe

+ +
performanceObserver.disconnect();
+ +

Exemple

+ +
const observer = new PerformanceObserver(function(list, obj) {
+  let entries = list.getEntries();
+  for (let i=0; i < entries.length; i++) {
+    // Traiter les événements "mark" et "frame"
+  }
+});
+observer.observe({entryTypes: ["mark", "frame"]});
+
+function perf_observer(list, observer) {
+  // Traiter l'événement "measure".
+  // ...
+  // Désactiver les événements de performance supplémentaires
+  observer.disconnect();
+}
+const observer2 = new PerformanceObserver(perf_observer);
+observer2.observe({entryTypes: ["measure"]});
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', + '#dom-performanceobserver-disconnect', 'disconnect()')}}{{Spec2('Performance Timeline Level 2')}}Définition initiale de la méthode disconnect().
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceObserver.disconnect")}}

diff --git a/files/fr/web/api/performanceobserver/index.html b/files/fr/web/api/performanceobserver/index.html new file mode 100644 index 0000000000..2b52bba127 --- /dev/null +++ b/files/fr/web/api/performanceobserver/index.html @@ -0,0 +1,75 @@ +--- +title: PerformanceObserver +slug: Web/API/PerformanceObserver +tags: + - API + - Interface + - Performance Observer API + - PerformanceObserver + - Reference + - Performance Web + - observers +translation_of: Web/API/PerformanceObserver +--- +
{{APIRef("Performance Timeline API")}}
+ +

L'interface PerformanceObserver est utilisée pour observer les événements de mesure des performances et être notifié des nouvelles entréés de performance lorsqu'elles sont enregistrées dans la chronologie des performances du navigateur.

+ +

{{AvailableInWorkers}}

+ +

Constructeur

+ +
+
PerformanceObserver()
+
Crée et retourne un nouvel objet PerformanceObserver.
+
+ +

Méthodes

+ +
+
PerformanceObserver.observe()
+
Spécifie l'ensemble des types d'entrées à observer. La fonction de rappel de l'observateur de performances sera invoquée lorsqu'une entrée de performance est enregistrée pour l'un des entryTypes spécifiés.
+
PerformanceObserver.disconnect()
+
Arrête l'observation des entrées de performances.
+
PerformanceObserver.takeRecords() {{Experimental_Inline}}
+
Renvoie la liste actuelle des entrées de performances stockées dans l'observateur de performance, en la vidant.
+
+ +

Exemple

+ +
function perf_observer(list, observer) {
+  // Traiter l'événement "measure".
+}
+const observer2 = new PerformanceObserver(perf_observer);
+observer2.observe({entryTypes: ["measure"]});
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', '#dom-performanceobserver', 'PerformanceObserver')}}{{Spec2('Performance Timeline Level 2')}}Définition initiale de l'interface PerformanceObserver.
+ +

Compatibilité des navigateurs

+ +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performanceobserver/observe/index.html b/files/fr/web/api/performanceobserver/observe/index.html new file mode 100644 index 0000000000..60366f066a --- /dev/null +++ b/files/fr/web/api/performanceobserver/observe/index.html @@ -0,0 +1,79 @@ +--- +title: PerformanceObserver.observe() +slug: Web/API/PerformanceObserver/observe +tags: + - API + - Method + - Méthode + - Performance + - PerformanceObserver + - Reference + - Performance Web +translation_of: Web/API/PerformanceObserver/observe +--- +
{{APIRef("Performance Timeline API")}}
+ +

La méthode observe() de l'interface PerformanceObserver est utilisée pour spécifier l'ensemble des types d'entrée de performance à observer. Les types d'entrée de performance sont spécifiés sous la forme d'un tableau d'objets DOMString, chacun nommant un type d'entrée ; les noms de type sont documentés sur la page PerformanceEntry.entryType.

+ +

Lorsqu'une entrée de performance correspondante est enregistrée, la fonction de rappel de l'observateur de performance — définie lors de la création du PerformanceObserver — est invoquée.

+ +

Syntaxe

+ +
observer.observe(options);
+ +

Paramètres

+ +
+
options
+
Un dictionnaire PerformanceObserverInit avec les membres possibles suivants : +
    +
  • entryTypes : Un tableau d'objets DOMString, chacun spécifiant un type d'entrée de performance à observer. Ne peut pas être utilisé avec les options « type » ou « buffered ».
    • +
  • type : Une DOMString unique spécifiant exactement un type d'entrée de performance à observer. Ne peut pas être utilisé avec l'option entryTypes.
    • +
  • buffered : Un indicateur booléen pour indiquer si les entrées en mémoire tampon doivent être mises en file d'attente dans la mémoire tampon de l'observateur. Ne doit être utilisé qu'avec l'option « type ».
    • +
+

Voir PerformanceEntry.entryType pour une liste des noms de types d'entrées de performance valides. Les types non reconnus sont ignorés, bien que le navigateur puisse afficher un message d'avertissement sur la console pour aider les développeurs à déboguer leur code. Si aucun type valide n'est trouvé, observe() n'a aucun effet.

+
+
+ +

Exemple

+ +

Cet exemple crée et configure deux PerformanceObservers ; l'un surveille les événements "mark" et "frame", et l'autre surveille les événements "measure".

+ +
const observer = new PerformanceObserver(function(list, obj) {
+  let entries = list.getEntries();
+  for (let i = 0; i < entries.length; i++) {
+    // Traiter les événements "mark" et "famse"
+  }
+});
+observer.observe({entryTypes: ["mark", "frame"]});
+
+function perf_observer(list, observer) {
+  // Traiter l'événement "measure"
+}
+const observer2 = new PerformanceObserver(perf_observer);
+observer2.observe({entryTypes: ["measure"]});
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', '#dom-performanceobserver-observe', + 'observe()')}}{{Spec2('Performance Timeline Level 2')}}Définition initiale de la méthode observe().
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceObserver.observe")}}

diff --git a/files/fr/web/api/performanceobserver/performanceobserver/index.html b/files/fr/web/api/performanceobserver/performanceobserver/index.html new file mode 100644 index 0000000000..f0388d0689 --- /dev/null +++ b/files/fr/web/api/performanceobserver/performanceobserver/index.html @@ -0,0 +1,71 @@ +--- +title: PerformanceObserver() +slug: Web/API/PerformanceObserver/PerformanceObserver +tags: + - API + - Constructor + - Constructeur + - PerformanceObserver + - Reference + - Performance Web +translation_of: Web/API/PerformanceObserver/PerformanceObserver +--- +
{{APIRef("Performance Timeline API")}}
+ +

Le constructeur PerformanceObserver() crée un nouvel objet PerformanceObserver avec le callback d'observation donné. La fonction de rappel de l'observateur est invoquée lorsque des événements d'entrée de performance sont répertoriés pour les types d'entrées qui ont été enregistrés, via la méthode observe().

+ +

Syntaxe

+ +
const observer = new PerformanceObserver(callback);
+ +

Paramètres

+ +
+
callback
+
Une fonction de rappel qui sera invoquée lorsque des événements de performance observés sont enregistrés. Lorsque la fonction de rappel est invoquée, son premier paramètre est une liste des entrées de l'observateur de performance et le second paramètre est l'objet PerformanceObserver courant.
+
+ +

Valeur de retour

+ +

Un nouvel objet PerformanceObserver qui appellera le callback spécifiée lorsque des événements de performance observés se produisent.

+ +

Exemple

+ +
const observer = new PerformanceObserver(function(list, obj) {
+  let entries = list.getEntries();
+  for (let i = 0; i < entries.length; i++) {
+    // Traiter les événements "mark" et "frame"
+  }
+});
+observer.observe({entryTypes: ["mark", "frame"]});
+
+function perf_observer(list, observer) {
+  // Traiter l'événement "measure"
+}
+const observer2 = new PerformanceObserver(perf_observer);
+observer2.observe({entryTypes: ["measure"]});
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', + '#idl-def-performanceobservercallback', 'PerformanceObserver()')}}{{Spec2('Performance Timeline Level 2')}}Définition initiale du constructeur PerformanceObserver().
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceobserver/takerecords/index.html b/files/fr/web/api/performanceobserver/takerecords/index.html new file mode 100644 index 0000000000..3d7dba65c9 --- /dev/null +++ b/files/fr/web/api/performanceobserver/takerecords/index.html @@ -0,0 +1,68 @@ +--- +title: PerformanceObserver.takeRecords() +slug: Web/API/PerformanceObserver/takeRecords +tags: +- API +- Method +- Méthode +- Performance Observer API +- PerformanceObserver +- Reference +- observers +- takeRecords() +translation_of: Web/API/PerformanceObserver/disconnect +--- +
{{APIRef("Performance Timeline API")}}
+ +

La méthode takeRecords() de l'interface PerformanceObserver renvoie la liste actuelle des entrées de performance stockées dans l'observateur de performance, en la vidant.

+ +

Syntaxe

+ +
let performanceEntryList = performanceObserver.takeRecords();
+ +

Paramètres

+ +

Aucun.

+ +

Valeur de retour

+ +

Une liste d'objets PerformanceEntry.

+ +

Exemple

+ +
const observer = new PerformanceObserver(function(list, obj) {
+  let entries = list.getEntries();
+  for (let i= 0; i < entries.length; i++) {
+    // Traiter les événements "mark" et "frame"
+  }
+});
+observer.observe({entryTypes: ["mark", "frame"]});
+let records = observer.takeRecords();
+console.log(records[0].name);
+console.log(records[0].startTime);
+console.log(records[0].duration);
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', + '#dom-performanceobserver-takerecords', 'takeRecords()')}}{{Spec2('Performance Timeline Level 2')}}Définition initiale de la méthode takeRecords().
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceObserver.takeRecords")}}

diff --git a/files/fr/web/api/performanceobserverentrylist/getentries/index.html b/files/fr/web/api/performanceobserverentrylist/getentries/index.html new file mode 100644 index 0000000000..4d24a1550a --- /dev/null +++ b/files/fr/web/api/performanceobserverentrylist/getentries/index.html @@ -0,0 +1,115 @@ +--- +title: PerformanceObserverEntryList.getEntries() +slug: Web/API/PerformanceObserverEntryList/getEntries +tags: + - API + - Method + - Méthode + - PerformanceObserverEntryList + - Reference + - Performance Web +translation_of: Web/API/PerformanceObserverEntryList/getEntries +--- +
{{APIRef("Performance Timeline API")}}
+ +

La méthode getEntries() de l'interface PerformanceObserverEntryList retourne une liste d'objets explicitement observés d'entrées de performance pour un filtre donné. Les membres de la liste sont déterminés par l'ensemble des types d'entrée spécifiés dans l'appel à la méthode observe(). La liste est disponible dans la fonction de rappel de l'observateur (en tant que premier paramètre de la fonction de rappel).

+ +
+

Remarque : Cette interface est exposée à Window et Worker.

+
+ +

Syntaxe

+ +
let entries = list.getEntries();
+entries = list.getEntries(PerformanceEntryFilterOptions);
+ +

Utilisation spécifique :

+ +
entries = list.getEntries({name: "entry_name", entryType: "mark"});
+ +

Paramètres

+ +
+
PerformanceEntryFilterOptions {{optional_inline}}
+
Est un dictionnaire PerformanceEntryFilterOptions, comportant les champs suivants : +
    +
  • "name", le nom d'une entrée de performance.
    • +
  • "entryType", le type d'entrée. Les types d'entrée valides sont énumérés dans la propriété PerformanceEntry.entryType.
    • +
  • "initiatorType", le type de la ressource initiatrice (par exemple un élément HTML). Les valeurs sont définies par la propriété PerformanceResourceTiming.initiatorType.
    • +
+ Ce paramètre n'est actuellement pas pris en charge par Chrome ou Opera. +
+
+ +

Valeur de retour

+ +

Une liste d'objets PerformanceEntry explicitement observés qui répondent aux critères du filtre. Les éléments seront dans l'ordre chronologique basé sur les startTime des entrées. Si aucun objet répondant au filtre n'est trouvé, une liste vide est renvoyée. Si aucun argument n'est fourni, toutes les entrées sont renvoyées.

+ +

Exemple

+ +
function print_perf_entry(pe) {
+  console.log("name: " + pe.name +
+              "; entryType: " + pe.entryType +
+              "; startTime: " + pe.startTime +
+              "; duration: " + pe.duration);
+}
+
+// Crée un observateur pour tous les types d'événements de performance
+const observe_all = new PerformanceObserver(function(list, obs) {
+  let perfEntries;
+
+  // Imprime toutes les entrées
+  perfEntries = list.getEntries();
+  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 < perfEntries.length; i++) {
+    print_perf_entry(perfEntries[i]);
+  }
+
+  // Imprime les entrées de type "mark".
+  perfEntries = list.getEntriesByType("mark");
+  for (let i = 0; i < perfEntries.length; i++) {
+    print_perf_entry(perfEntries[i]);
+  }
+});
+// inscrire tous les types d'événements de performance
+observe_all.observe({entryTypes: ['frame', 'mark', 'measure', 'navigation', 'resource', 'server']});
+
+const observe_frame = new PerformanceObserver(function(list, obs) {
+  let perfEntries = list.getEntries();
+  // Ne devrait avoir que des entrées "frame"
+  for (let i = 0; i < perfEntries.length; i++) {
+    print_perf_entry(perfEntries[i]);
+  }
+});
+// inscrire à l'événement "frame" uniquement
+observe_frame.observe({entryTypes: ['frame']});
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', + '#dom-performanceobserverentrylist-getentries', 'getEntries()')}}{{Spec2('Performance Timeline Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceObserverEntryList.getEntries")}}

diff --git a/files/fr/web/api/performanceobserverentrylist/getentriesbyname/index.html b/files/fr/web/api/performanceobserverentrylist/getentriesbyname/index.html new file mode 100644 index 0000000000..f1a517d93a --- /dev/null +++ b/files/fr/web/api/performanceobserverentrylist/getentriesbyname/index.html @@ -0,0 +1,105 @@ +--- +title: PerformanceObserverEntryList.getEntriesByName() +slug: Web/API/PerformanceObserverEntryList/getEntriesByName +tags: + - API + - Method + - Méthode + - PerformanceObserverEntryList + - Reference + - Performance Web +translation_of: Web/API/PerformanceObserverEntryList/getEntriesByName +--- +
{{APIRef("Performance Timeline API")}}
+ +

La méthode getEntriesByName() de l'interface PerformanceObserverEntryList retourne une liste d'objets d'entrée de performance explicitement observés pour un name et entryType donnés. Les membres de la liste sont déterminés par l'ensemble des types d'entrées spécifiés dans l'appel à la méthode observe(). La liste est disponible dans la fonction de rappel de l'observateur (en tant que premier paramètre de la fonction de rappel).

+ +
+

Remarque : Cette interface est exposée à Window et Worker.

+
+ +

Syntaxe

+ +
let entries = list.getEntriesByName(name, type);
+ +

Paramètres

+ +
+
name
+
Une chaîne de caractères DOMString représentant le nom de l'entrée à récupérer.
+
type {{optional_inline}}
+
Une chaîne de caractères DOMString représentant le type d'entrée à récupérer tel que « mark ». Les types d'entrée valides sont énumérés dans PerformanceEntry.entryType.
+
+ +

Valeur de retour

+ +

Une liste d'objets d'entrée de performance explicitement observés qui ont le name et le type spécifiés. Si l'argument type n'est pas spécifié, seul name sera utilisé pour déterminer les entrées à retourner. Les éléments seront triés dans l'ordre chronologique selon les startTime des entrées. Si aucun objet ne répond aux critères spécifiés, une liste vide est retournée.

+ +

Exemple

+ +
function print_perf_entry(pe) {
+  console.log("name: " + pe.name +
+              "; entryType: " + pe.entryType +
+              "; startTime: " + pe.startTime +
+              "; duration: " + pe.duration);
+}
+
+// Crée un observateur pour tous les types d'événements de performance
+const observe_all = new PerformanceObserver(function(list, obs) {
+  let perfEntries;
+
+  // Imprime toutes les entrées
+  perfEntries = list.getEntries();
+  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 < perfEntries.length; i++) {
+    print_perf_entry(perfEntries[i]);
+  }
+
+  // Imprime les entrées de type "mark".
+  perfEntries = list.getEntriesByType("mark");
+  for (let i = 0; i < perfEntries.length; i++) {
+    print_perf_entry(perfEntries[i]);
+  }
+});
+// inscrire tous les types d'événements de performance
+observe_all.observe({entryTypes: ['frame', 'mark', 'measure', 'navigation', 'resource', 'server']});
+
+const observe_frame = new PerformanceObserver(function(list, obs) {
+  let perfEntries = list.getEntries();
+  // Ne devrait avoir que des entrées "frame"
+  for (let i = 0; i < perfEntries.length; i++) {
+    print_perf_entry(perfEntries[i]);
+  }
+});
+// inscrire à l'événement "frame" uniquement
+observe_frame.observe({entryTypes: ['frame']});
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', + '#dom-performanceobserverentrylist-getentriesbyname', 'getEntriesByName()')}}{{Spec2('Performance Timeline Level 2')}}Définition initiale de la méthode getEntriesByName().
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceObserverEntryList.getEntriesByName")}}

diff --git a/files/fr/web/api/performanceobserverentrylist/getentriesbytype/index.html b/files/fr/web/api/performanceobserverentrylist/getentriesbytype/index.html new file mode 100644 index 0000000000..cf8e62a58e --- /dev/null +++ b/files/fr/web/api/performanceobserverentrylist/getentriesbytype/index.html @@ -0,0 +1,102 @@ +--- +title: PerformanceObserverEntryList.getEntriesByType() +slug: Web/API/PerformanceObserverEntryList/getEntriesByType +tags: + - API + - Method + - Méthodes + - PerformanceObserverEntryList + - Reference + - Performance Web +translation_of: Web/API/PerformanceObserverEntryList/getEntriesByType +--- +
{{APIRef("Performance Timeline API")}}
+ +

La méthode getEntriesByType() de la PerformanceObserverEntryList retourne une liste d'objets d'entrée de performance explicitement observés pour un type d'entrée de performance. Les membres de la liste sont déterminés par l'ensemble des types d'entrées spécifiés dans l'appel à la méthode observe(). La liste est disponible dans la fonction de rappel de l'observateur (en tant que premier paramètre de la fonction de rappel).

+ +
+

Remarque : Cette interface est exposée à Window et Worker.

+
+ +

Syntaxe

+ +
let entries = list.getEntriesByType(type);
+ +

Paramètres

+ +
+
type
+
Le type d'entrée à récupérer, tel que « frame ». Les types d'entrée valides sont énumérés dans PerformanceEntry.entryType.
+
+ +

Valeur de retour

+ +

Une liste d'objets PerformanceEntry explicitement observés qui ont le type spécifié. Les éléments seront dans l'ordre chronologique basé sur les startTime des entrées. Si aucun objet n'a le type spécifié, ou si aucun argument n'est fourni, une liste vide est retournée.

+ +

Exemple

+ +
function print_perf_entry(pe) {
+  console.log("name: " + pe.name +
+              "; entryType: " + pe.entryType +
+              "; startTime: " + pe.startTime +
+              "; duration: " + pe.duration);
+}
+
+// Crée un observateur pour tous les types d'événements de performance
+const observe_all = new PerformanceObserver(function(list, obs) {
+  let perfEntries;
+
+  // Imprime toutes les entrées
+  perfEntries = list.getEntries();
+  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 < perfEntries.length; i++) {
+    print_perf_entry(perfEntries[i]);
+  }
+
+  // Imprime les entrées de type "mark".
+  perfEntries = list.getEntriesByType("mark");
+  for (let i = 0; i < perfEntries.length; i++) {
+    print_perf_entry(perfEntries[i]);
+  }
+});
+// inscrire tous les types d'événements de performance
+observe_all.observe({entryTypes: ['frame', 'mark', 'measure', 'navigation', 'resource', 'server']});
+
+const observe_frame = new PerformanceObserver(function(list, obs) {
+  let perfEntries = list.getEntries();
+  // Ne devrait avoir que des entrées "frame"
+  for (let i = 0; i < perfEntries.length; i++) {
+    print_perf_entry(perfEntries[i]);
+  }
+});
+// inscrire à l'événement "frame" uniquement
+observe_frame.observe({entryTypes: ['frame']});
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', '#dom-performanceobserverentrylist-getentriesbytype', 'getEntriesByType()')}}{{Spec2('Performance Timeline Level 2')}}Définition initiale de la méthode getEntriesByType().
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceObserverEntryList.getEntriesByType")}}

diff --git a/files/fr/web/api/performanceobserverentrylist/index.html b/files/fr/web/api/performanceobserverentrylist/index.html new file mode 100644 index 0000000000..7b1ad9d5cb --- /dev/null +++ b/files/fr/web/api/performanceobserverentrylist/index.html @@ -0,0 +1,63 @@ +--- +title: PerformanceObserverEntryList +slug: Web/API/PerformanceObserverEntryList +tags: + - API + - Interface + - Reference + - Performance Web +translation_of: Web/API/PerformanceObserverEntryList +--- +
{{APIRef("Performance Timeline API")}}
+ +

L'interface PerformanceObserverEntryList est une liste d'événements de performance qui ont été explicitement observés via la méthode observe().

+ +
+

Remarque : Cette interface est exposée à Window et Worker.

+
+ +

Méthodes

+ +
+
PerformanceObserverEntryList.getEntries()
+
Retourne une liste d'objets explicitement observés de PerformanceEntry en fonction du filtre donné.
+
PerformanceObserverEntryList.getEntriesByType()
+
Retourne une liste d'objets explicitement observés de PerformanceEntry du type d'entrée donné.
+
PerformanceObserverEntryList.getEntriesByName()
+
Retourne une liste d'objets explicitement observés de PerformanceEntry en fonction du nom et du type d'entrée donnés.
+
+ +

Exemple

+ +
// Crée un observateur pour tous les types d'événements de performance
+// la liste est de type PerformanceObserveEntryList
+const observe_all = new PerformanceObserver(function(list, obs) {
+  let perfEntries = list.getEntries();
+  for (let i = 0; i < perfEntries.length; i++) {
+    print_perf_entry(perfEntries[i]);
+    // faire quelque chose avec
+  }
+})
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Performance Timeline Level 2', '#idl-def-performanceobserverentrylist', 'PerformanceObserverEntryList')}}{{Spec2('Performance Timeline Level 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performancepainttiming/index.html b/files/fr/web/api/performancepainttiming/index.html new file mode 100644 index 0000000000..6fc7c6c392 --- /dev/null +++ b/files/fr/web/api/performancepainttiming/index.html @@ -0,0 +1,81 @@ +--- +title: PerformancePaintTiming +slug: Web/API/PerformancePaintTiming +tags: + - API + - Interface + - Paint Timing + - Performance Timeline API + - PerformancePaintTiming + - Reference + - Performance Web +translation_of: Web/API/PerformancePaintTiming +--- +

{{APIRef("Performance Timeline API")}}

+ +

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

+ +

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

+ +

{{InheritanceDiagram}}

+ +

Propriétés

+ +

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

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

Méthodes

+ +

Cette interface n'a pas de méthodes.

+ +

Exemple

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

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

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

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Paint Timing','#sec-PerformancePaintTiming','PerformancePaintTiming')}}{{Spec2('Paint Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceresourcetiming/connectend/index.html b/files/fr/web/api/performanceresourcetiming/connectend/index.html new file mode 100644 index 0000000000..a7b5dcf04c --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/connectend/index.html @@ -0,0 +1,84 @@ +--- +title: PerformanceResourceTiming.connectEnd +slug: Web/API/PerformanceResourceTiming/connectEnd +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - connectEnd +translation_of: Web/API/PerformanceResourceTiming/connectEnd +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule connectEnd renvoie le timestamp de l'instant suivant immédiatement la fin d'établissement de la connexion du navigateur au serveur pour récupérer la ressource. La valeur de l'horodatage comprend l'intervalle de temps pour établir la connexion de transport, ainsi que d'autres intervalles de temps tels que la poignée de main TLS/SSL et l'authentification SOCKS.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.connectEnd;
+ +

Valeur de retour

+ +

Un DOMHighResTimeStamp représentant le temps après l'établissement d'une connexion.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont consignés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', '#dom-performanceresourcetiming-connectend', + 'connectEnd')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.connectEnd")}}

diff --git a/files/fr/web/api/performanceresourcetiming/connectstart/index.html b/files/fr/web/api/performanceresourcetiming/connectstart/index.html new file mode 100644 index 0000000000..198a11274c --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/connectstart/index.html @@ -0,0 +1,84 @@ +--- +title: PerformanceResourceTiming.connectStart +slug: Web/API/PerformanceResourceTiming/connectStart +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - connectStart +translation_of: Web/API/PerformanceResourceTiming/connectStart +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule connectStart retourne le timestamp de l'instant avant que l'agent utilisateur ne commence à établir la connexion au serveur pour récupérer la ressource.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.connectStart;
+ +

Valeur de retour

+ +

Un DOMHighResTimeStamp immédiatement avant que le navigateur ne commence à établir la connexion avec le serveur pour récupérer la ressource.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont consignés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', '#dom-performanceresourcetiming-connectstart', + 'connectStart')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.connectStart")}}

diff --git a/files/fr/web/api/performanceresourcetiming/decodedbodysize/index.html b/files/fr/web/api/performanceresourcetiming/decodedbodysize/index.html new file mode 100644 index 0000000000..d7a23cd166 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/decodedbodysize/index.html @@ -0,0 +1,84 @@ +--- +title: PerformanceResourceTiming.decodedBodySize +slug: Web/API/PerformanceResourceTiming/decodedBodySize +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - decodedBodySize +translation_of: Web/API/PerformanceResourceTiming/decodedBodySize +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule decodedBodySize renvoie la taille (en octets) reçue de la récupération (HTTP ou cache) du corps du message, après suppression de tout codage de contenu appliqué. Si la ressource est récupérée à partir d'un cache d'application ou de ressources locales, elle renvoie la taille de la donnée utile après suppression de tous les codages de contenu appliqués.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.decodedBodySize;
+ +

Valeur de retour

+ +

La taille (en octets) reçue de l'extraction (HTTP ou cache) du corps du message, après suppression de tout codage de contenu appliqué.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés de taille de tous les événements de type "resource" est enregistrée.

+ +
function log_sizes(perfEntry){
+  // Vérifie la prise en charge des propriétés *size et imprime leurs
+  // valeurs si elles sont prises en charge.
+  if ("decodedBodySize" in perfEntry) {
+    console.log("decodedBodySize = " + perfEntry.decodedBodySize);
+  } else {
+    console.log("decodedBodySize = N'EST PAS pris en charge");
+  }
+
+  if ("encodedBodySize" in perfEntry) {
+    console.log("encodedBodySize = " + perfEntry.encodedBodySize);
+  } else {
+    console.log("encodedBodySize = N'EST PAS pris en charge");
+  }
+
+  if ("transferSize" in perfEntry) {
+    console.log("transferSize = " + perfEntry.transferSize);
+  } else {
+    console.log("transferSize = N'EST PAS pris en charge");
+  }
+}
+function check_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    log_sizes(p[i]);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing 2', + '#dom-performanceresourcetiming-decodedbodysize', 'decodedBodySize')}}{{Spec2('Resource Timing 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.decodedBodySize")}}

diff --git a/files/fr/web/api/performanceresourcetiming/domainlookupend/index.html b/files/fr/web/api/performanceresourcetiming/domainlookupend/index.html new file mode 100644 index 0000000000..b2c3c38520 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/domainlookupend/index.html @@ -0,0 +1,86 @@ +--- +title: PerformanceResourceTiming.domainLookupEnd +slug: Web/API/PerformanceResourceTiming/domainLookupEnd +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - domainLookupEnd +translation_of: Web/API/PerformanceResourceTiming/domainLookupEnd +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule domainLookupEnd retourne le timestamp immédiatement après que le navigateur ait terminé la recherche du nom de domaine pour la ressource.

+ +

Si l'agent utilisateur dispose des informations de domaine dans le cache, domainLookupStart et domainLookupEnd représentent les moments où l'agent utilisateur commence et termine la récupération des données de domaine dans le cache.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.domainLookupEnd;
+ +

Valeur de retour

+ +

Un DOMHighResTimeStamp représentant l'heure immédiatement après la fin de la recherche du nom de domaine de la ressource par le navigateur.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont enregistrés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', '#dom-performanceresourcetiming-domainlookupend', + 'domainLookupEnd')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.domainLookupEnd")}}

diff --git a/files/fr/web/api/performanceresourcetiming/domainlookupstart/index.html b/files/fr/web/api/performanceresourcetiming/domainlookupstart/index.html new file mode 100644 index 0000000000..34f33fb6c9 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/domainlookupstart/index.html @@ -0,0 +1,84 @@ +--- +title: PerformanceResourceTiming.domainLookupStart +slug: Web/API/PerformanceResourceTiming/domainLookupStart +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - domainLookupStart +translation_of: Web/API/PerformanceResourceTiming/domainLookupStart +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule domainLookupStart retourne le timestamp immédiatement avant que le navigateur ne commence la recherche du nom de domaine pour la ressource.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.domainLookupStart;
+ +

Valeur de retour

+ +

Un DOMHighResTimeStamp immédiatement avant que le navigateur ne commence la recherche du nom de domaine pour la ressource.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont enregistrés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', + '#dom-performanceresourcetiming-domainlookupstart', 'domainLookupStart')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.domainLookupStart")}}

diff --git a/files/fr/web/api/performanceresourcetiming/encodedbodysize/index.html b/files/fr/web/api/performanceresourcetiming/encodedbodysize/index.html new file mode 100644 index 0000000000..ea3c0d6705 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/encodedbodysize/index.html @@ -0,0 +1,83 @@ +--- +title: PerformanceResourceTiming.encodedBodySize +slug: Web/API/PerformanceResourceTiming/encodedBodySize +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - encodedBodySize +translation_of: Web/API/PerformanceResourceTiming/encodedBodySize +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété encodedBodySize en lecture seule représente la taille (en octets) reçue de la récupération (HTTP ou cache), du corps de la donnée utile, avant de supprimer tout codage de contenu appliqué.

+ +

{{AvailableInWorkers}}

+ +

Si la ressource est extraite d'un cache d'application ou d'une ressource locale, elle doit renvoyer la taille du corps de la charge utile avant de supprimer tout codage de contenu appliqué.

+ +

Syntaxe

+ +
resource.encodedBodySize;
+ +

Valeur de retour

+ +

Un number représentant la taille (en octets) reçue de la récupération (HTTP ou cache), du corps de la donnée utile, avant de supprimer tout codage de contenu appliqué.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés de taille de tous les types "resource" sont enregistrées.

+ +
function log_sizes(perfEntry){
+  // Vérifie la prise en charge des propriétés PerformanceEntry.*size et imprime leurs valeurs
+  // si elles sont prises en charge
+  if ("decodedBodySize" in perfEntry)
+    console.log("decodedBodySize = " + perfEntry.decodedBodySize);
+  else
+    console.log("decodedBodySize = N'EST PAS pris en charge");
+
+  if ("encodedBodySize" in perfEntry)
+    console.log("encodedBodySize = " + perfEntry.encodedBodySize);
+  else
+    console.log("encodedBodySize = N'EST PAS pris en charge");
+
+  if ("transferSize" in perfEntry)
+    console.log("transferSize = " + perfEntry.transferSize);
+  else
+    console.log("transferSize = N'EST PAS pris en charge");
+}
+function check_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    log_sizes(p[i]);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing 2', + '#dom-performanceresourcetiming-encodedbodysize', 'encodedBodySize')}}{{Spec2('Resource Timing 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.encodedBodySize")}}

diff --git a/files/fr/web/api/performanceresourcetiming/fetchstart/index.html b/files/fr/web/api/performanceresourcetiming/fetchstart/index.html new file mode 100644 index 0000000000..2deb1ba0e9 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/fetchstart/index.html @@ -0,0 +1,86 @@ +--- +title: PerformanceResourceTiming.fetchStart +slug: Web/API/PerformanceResourceTiming/fetchStart +tags: +- API +- Property +- Propriété +- Reference +- Performance Web +- Resource Timing API +- fetchStart +translation_of: Web/API/PerformanceResourceTiming/fetchStart +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule fetchStart représente un timestamp immédiatement avant que le navigateur ne commence à récupérer la ressource.

+ +

S'il y a des redirections HTTP, la propriété renvoie le temps immédiatement avant que l'agent utilisateur ne commence à récupérer la ressource finale dans la redirection.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.fetchStart;
+ +

Valeur de retour

+ +

Un DOMHighResTimeStamp immédiatement avant que le navigateur ne commence à récupérer la ressource.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont enregistrés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', '#dom-performanceresourcetiming-fetchstart', + 'fetchStart')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.fetchStart")}}

diff --git a/files/fr/web/api/performanceresourcetiming/index.html b/files/fr/web/api/performanceresourcetiming/index.html new file mode 100644 index 0000000000..07f6f67147 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/index.html @@ -0,0 +1,118 @@ +--- +title: PerformanceResourceTiming +slug: Web/API/PerformanceResourceTiming +tags: + - API + - DOM + - Interface + - Reference + - Performance Web + - Resource Timing API +translation_of: Web/API/PerformanceResourceTiming +--- +
{{APIRef("Resource Timing API")}}
+ +

L'interface PerformanceResourceTiming permet de récupérer et d'analyser des données de synchronisation réseau détaillées concernant le chargement des ressources d'une application. Une application peut utiliser les mesures temporelles pour déterminer, par exemple, la durée nécessaire à l'extraction d'une ressource spécifique, telle qu'une XMLHttpRequest, un élément <svg>, une image ou un script.

+ +

Les propriétés de l'interface créent une chronologie de chargement des ressources avec un timestamps haute résolution pour les événements réseau tels que les heures de début et de fin de redirection, les heures de début de récupération, les heures de début et de fin de recherche DNS, les heures de début et de fin de réponse, etc. En outre, l'interface étend PerformanceEntry avec d'autres propriétés qui fournissent des données sur la taille de la ressource extraite ainsi que le type de ressource qui a initié l'extraction.

+ +

{{InheritanceDiagram}}

+ +

{{AvailableInWorkers}}

+ +

Propriétés

+ +

Cette interface étend les propriétés PerformanceEntry suivantes pour les types d'entrée de performance des ressources en les restreignant comme suit :

+ +
+
PerformanceEntry.entryType {{readonlyInline}}
+
Retourne "resource".
+
PerformanceEntry.name {{readonlyInline}}
+
Retourne l'URL des ressources.
+
PerformanceEntry.startTime {{readonlyInline}}
+
Retourne le timestamp de l'heure de début de la récupération d'une ressource. Cette valeur est équivalente à PerformanceResourceTiming.fetchStart.
+
PerformanceEntry.duration {{readonlyInline}}
+
Retourne un timestamp qui est la différence entre les propriétés responseEnd et startTime.
+
+ +

L'interface prend également en charge les propriétés suivantes, qui sont énumérées dans l'ordre temporel selon lequel elles sont enregistrées pour l'extraction d'une seule ressource. Une liste alphabétique est présentée dans la navigation, à gauche.

+ +
+
PerformanceResourceTiming.initiatorType {{readonlyInline}}
+
Une chaîne de caractère string représentant le type de ressource qui a initié l'entrée de performance, comme spécifié dans PerformanceResourceTiming.initiatorType.
+
PerformanceResourceTiming.nextHopProtocol {{readonlyInline}}
+
Une chaîne de caractère string représentant le protocole réseau utilisé pour récupérer la ressource, tel qu'identifié par le ALPN Protocol ID (RFC7301).
+
PerformanceResourceTiming.workerStart {{readonlyInline}}
+
Retourne un DOMHighResTimeStamp immédiatement avant de transmettre le FetchEvent si un processus de Service Worker est déjà en cours, ou immédiatement avant de lancer le processus de Service Worker s'il n'est pas encore en cours. Si la ressource n'est pas interceptée par un Service Worker, la propriété retourne toujours 0.
+
PerformanceResourceTiming.redirectStart {{readonlyInline}}
+
Un DOMHighResTimeStamp qui représente l'heure de début de l'extraction qui déclenche la redirection.
+
PerformanceResourceTiming.redirectEnd {{readonlyInline}}
+
Un DOMHighResTimeStamp immédiatement après la réception du dernier octet de la réponse de la dernière redirection.
+
PerformanceResourceTiming.fetchStart {{readonlyInline}}
+
Un DOMHighResTimeStamp immédiatement avant que le navigateur ne commence à récupérer la ressource.
+
PerformanceResourceTiming.domainLookupStart {{readonlyInline}}
+
Un DOMHighResTimeStamp immédiatement avant que le navigateur ne commence la recherche du nom de domaine pour la ressource.
+
PerformanceResourceTiming.domainLookupEnd {{readonlyInline}}
+
Un DOMHighResTimeStamp représentant l'heure immédiatement après la fin de la recherche du nom de domaine de la ressource par le navigateur.
+
PerformanceResourceTiming.connectStart {{readonlyInline}}
+
Un DOMHighResTimeStamp immédiatement avant que le navigateur ne commence à établir la connexion avec le serveur pour récupérer la ressource.
+
PerformanceResourceTiming.connectEnd {{readonlyInline}}
+
Un DOMHighResTimeStamp immédiatement après que le navigateur ait fini d'établir la connexion avec le serveur pour récupérer la ressource.
+
PerformanceResourceTiming.secureConnectionStart {{readonlyInline}}
+
Un DOMHighResTimeStamp immédiatement avant que le navigateur ne lance le processus de reconnaissance pour sécuriser la connexion en cours.
+
PerformanceResourceTiming.requestStart {{readonlyInline}}
+
Un DOMHighResTimeStamp immédiatement avant que le navigateur ne commence à demander la ressource au serveur.
+
PerformanceResourceTiming.responseStart {{readonlyInline}}
+
Un DOMHighResTimeStamp immédiatement après que le navigateur ait reçu le premier octet de la réponse du serveur.
+
PerformanceResourceTiming.responseEnd {{readonlyInline}}
+
Un DOMHighResTimeStamp immédiatement après la réception par le navigateur du dernier octet de la ressource ou immédiatement avant la fermeture de la connexion de transfert, selon la première éventualité.
+
PerformanceResourceTiming.transferSize {{readonlyInline}}
+
Un nombre représentant la taille (en octets) de la ressource extraite. La taille comprend les champs d'en-tête de la réponse plus le corps des données utiles de la réponse.
+
PerformanceResourceTiming.encodedBodySize {{readonlyInline}}
+
Un nombre représentant la taille (en octets) reçue de la récupération (HTTP ou cache), du corps de la donnée, avant de supprimer tout codage de contenu appliqué.
+
PerformanceResourceTiming.decodedBodySize {{readonlyInline}}
+
Un nombre représentant la taille (en octets) reçue de la récupération (HTTP ou cache) du message body, après avoir retiré tout codage de contenu appliqué.
+
PerformanceResourceTiming.serverTiming {{readonlyInline}}
+
Un tableau d'entrées PerformanceServerTiming contenant des mesures de synchronisation du serveur.
+
+ +

Méthodes

+ +
+
PerformanceResourceTiming.toJSON()
+
Renvoie une chaîne de caractère DOMString qui est la représentation JSON de l'objet PerformanceResourceTiming.
+
+ +

Exemple

+ +

Voir l'exemple dans Utilisation de Resource Timing API.

+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', '#performanceresourcetiming', 'PerformanceResourceTiming')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performanceresourcetiming/initiatortype/index.html b/files/fr/web/api/performanceresourcetiming/initiatortype/index.html new file mode 100644 index 0000000000..b63192a685 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/initiatortype/index.html @@ -0,0 +1,78 @@ +--- +title: PerformanceResourceTiming.initiatorType +slug: Web/API/PerformanceResourceTiming/initiatorType +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - initiatorType +translation_of: Web/API/PerformanceResourceTiming/initiatorType +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété initiatorType en lecture seule est une chaîne de caractères qui représente le type de ressource qui a initié l'événement de performance.

+ +

La valeur de cette chaîne est la suivante:

+ + + +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.initiatorType;
+ +

Valeur de retour

+ +

Une chaîne de caractères (DOMString) représentant le type de ressource qui a initié l'événement de performance, comme spécifié ci-dessus.

+ +

Exemple

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_initiatorType(p[i]);
+  }
+}
+function print_initiatorType(perfEntry) {
+  // Imprime la valeur initiatorType de cet objet d'entrée de performance
+  let value = "initiatorType" in perfEntry;
+  if (value)
+    console.log("... initiatorType = " + perfEntry.initiatorType);
+  else
+    console.log("... initiatorType = N'EST PAS pris en charge");
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', + '#dom-performanceresourcetiming-initiatortype', 'initiatorType')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.initiatorType")}}

diff --git a/files/fr/web/api/performanceresourcetiming/nexthopprotocol/index.html b/files/fr/web/api/performanceresourcetiming/nexthopprotocol/index.html new file mode 100644 index 0000000000..e08dab0889 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/nexthopprotocol/index.html @@ -0,0 +1,72 @@ +--- +title: PerformanceResourceTiming.nextHopProtocol +slug: Web/API/PerformanceResourceTiming/nextHopProtocol +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - nextHopProtocol +translation_of: Web/API/PerformanceResourceTiming/nextHopProtocol +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule nextHopProtocol est une chaîne de caractères représentant le protocole réseau utilisé pour récupérer la ressource, tel qu'identifié par le ALPN Protocol ID (RFC7301).

+ +

Lorsqu'un proxy est utilisé, si une connexion tunnel est établie, cette propriété renvoie l'ID du protocole ALPN du protocole tunnelisé. Sinon, cette propriété renvoie l'ID du protocole ALPN du premier saut vers le proxy.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.nextHopProtocol;
+ +

Valeur de retour

+ +

Une chaîne de caractères string représentant le protocole réseau utilisé pour récupérer la ressource, tel qu'identifié par le ALPN Protocol ID (RFC7301).

+ +

Exemple

+ +

L'exemple suivant utilise la propriété nextHopProtocol :

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_nextHopProtocol(p[i]);
+  }
+}
+function print_nextHopProtocol(perfEntry) {
+  let value = "nextHopProtocol" in perfEntry;
+  if (value)
+    console.log("nextHopProtocol = " + perfEntry.nextHopProtocol);
+  else
+    console.log("nextHopProtocol = N'EST PAS pris en charge");
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing 2', + '#dom-performanceresourcetiming-nexthopprotocol', 'nextHopProtocol')}}{{Spec2('Resource Timing 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.nextHopProtocol")}}

diff --git a/files/fr/web/api/performanceresourcetiming/redirectend/index.html b/files/fr/web/api/performanceresourcetiming/redirectend/index.html new file mode 100644 index 0000000000..e5474b37b9 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/redirectend/index.html @@ -0,0 +1,86 @@ +--- +title: PerformanceResourceTiming.redirectEnd +slug: Web/API/PerformanceResourceTiming/redirectEnd +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - redirectEnd +translation_of: Web/API/PerformanceResourceTiming/redirectEnd +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule redirectEnd retourne un timestamp immédiatement après la réception du dernier octet de la réponse de la dernière redirection.

+ +

Lors de l'extraction d'une ressource, s'il y a plusieurs redirections HTTP, que l'une d'entre elles a une origine différente du document actuel, et que l'algorithme de vérification d'autorisation de synchronisation réussit pour chaque ressource redirigée, cette propriété renvoie l'heure immédiatement après la réception du dernier octet de la réponse de la dernière redirection ; sinon, zéro est retourné.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.redirectEnd;
+ +

Valeur de retour

+ +

Un timestamp immédiatement après la réception du dernier octet de la réponse de la dernière redirection.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont enregistrés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', '#dom-performanceresourcetiming-redirectend', + 'redirectEnd')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.redirectEnd")}}

diff --git a/files/fr/web/api/performanceresourcetiming/redirectstart/index.html b/files/fr/web/api/performanceresourcetiming/redirectstart/index.html new file mode 100644 index 0000000000..626038c80b --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/redirectstart/index.html @@ -0,0 +1,86 @@ +--- +title: PerformanceResourceTiming.redirectStart +slug: Web/API/PerformanceResourceTiming/redirectStart +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - redirectStart +translation_of: Web/API/PerformanceResourceTiming/redirectStart +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule redirectStart retourne un timestamp représentant l'instant du début de la récupération qui initie la redirection.

+ +

S'il y a des redirections HTTP lors de l'extraction de la ressource et si l'une des redirections ne provient pas de la même origine que le document actuel, mais que l'algorithme de vérification de l'autorisation de synchronisation réussit pour chaque ressource redirigée, cette propriété renvoie l'heure de début de l'extraction qui initie la redirection ; sinon, zéro est renvoyé.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.redirectStart;
+ +

Valeur de retour

+ +

Un timestamp représentant l'heure de début de l'extraction qui déclenche la redirection.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont enregistrés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', '#dom-performanceresourcetiming-redirectstart', + 'redirectStart')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.redirectStart")}}

diff --git a/files/fr/web/api/performanceresourcetiming/requeststart/index.html b/files/fr/web/api/performanceresourcetiming/requeststart/index.html new file mode 100644 index 0000000000..de0bec6a29 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/requeststart/index.html @@ -0,0 +1,86 @@ +--- +title: PerformanceResourceTiming.requestStart +slug: Web/API/PerformanceResourceTiming/requestStart +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - requestStart +translation_of: Web/API/PerformanceResourceTiming/requestStart +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule requestStart renvoie un timestamp du moment immédiatement avant que le navigateur ne commence à demander la ressource au serveur, au cache ou à la ressource locale. Si la connexion de transport échoue et que le navigateur retire la demande, la valeur renvoyée sera le début de la nouvelle demande.

+ +

Il n'y a pas de propriété de fin (« requestEnd ») correspondante pour requestStart.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.requestStart;
+ +

Valeur de retour

+ +

Un DOMHighResTimeStamp représentant le moment immédiatement avant que le navigateur ne commence à demander la ressource au serveur.

+ +

Example

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont enregistrés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', '#dom-performanceresourcetiming-requeststart', + 'requestStart')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.requestStart")}}

diff --git a/files/fr/web/api/performanceresourcetiming/responseend/index.html b/files/fr/web/api/performanceresourcetiming/responseend/index.html new file mode 100644 index 0000000000..a87722b213 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/responseend/index.html @@ -0,0 +1,84 @@ +--- +title: PerformanceResourceTiming.responseEnd +slug: Web/API/PerformanceResourceTiming/responseEnd +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - responseEnd +translation_of: Web/API/PerformanceResourceTiming/responseEnd +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule responseEnd retourne un timestamp immédiatement après que le navigateur a reçu le dernier octet de la ressource ou immédiatement avant la fermeture de la connexion de transport, selon ce qui se produit en premier.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.responseEnd;
+ +

Valeur de retour

+ +

Un DOMHighResTimeStamp immédiatement après la réception par le navigateur du dernier octet de la ressource ou immédiatement avant la fermeture de la connexion de transport, selon ce qui arrive en premier.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont enregistrés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', '#dom-performanceresourcetiming-responseend', + 'responseEnd')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.responseEnd")}}

diff --git a/files/fr/web/api/performanceresourcetiming/responsestart/index.html b/files/fr/web/api/performanceresourcetiming/responsestart/index.html new file mode 100644 index 0000000000..bf531b5c93 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/responsestart/index.html @@ -0,0 +1,84 @@ +--- +title: PerformanceResourceTiming.responseStart +slug: Web/API/PerformanceResourceTiming/responseStart +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - responseStart +translation_of: Web/API/PerformanceResourceTiming/responseStart +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule responseStart renvoie un timestamp immédiatement après que le navigateur a reçu le premier octet de la réponse du serveur, du cache ou de la ressource locale.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.responseStart;
+ +

Valeur de retour

+ +

Un DOMHighResTimeStamp immédiatement après que le navigateur ait reçu le premier octet de la réponse du serveur.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont enregistrés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', '#dom-performanceresourcetiming-responsestart', + 'responseStart')}}{{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.responseStart")}}

diff --git a/files/fr/web/api/performanceresourcetiming/secureconnectionstart/index.html b/files/fr/web/api/performanceresourcetiming/secureconnectionstart/index.html new file mode 100644 index 0000000000..605fa47e55 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/secureconnectionstart/index.html @@ -0,0 +1,85 @@ +--- +title: PerformanceResourceTiming.secureConnectionStart +slug: Web/API/PerformanceResourceTiming/secureConnectionStart +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - secureConnectionStart +translation_of: Web/API/PerformanceResourceTiming/secureConnectionStart +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule secureConnectionStart renvoie un timestamp immédiatement avant que le navigateur ne commence le processus de poignée de main (handshake) pour sécuriser la connexion actuelle. Si une connexion sécurisée n'est pas utilisée, la propriété renvoie zéro.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.secureConnectionStart;
+ +

Valeur de retour

+ +

Si la ressource est récupérée par le biais d'une connexion sécurisée, un DOMHighResTimeStamp immédiatement avant que le navigateur ne lance le processus de poignée de main (handshake) pour sécuriser la connexion actuelle. Si une connexion sécurisée n'est pas utilisée, cette propriété renvoie zéro.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont enregistrés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing', + '#dom-performanceresourcetiming-secureconnectionstart', 'secureConnectionStart')}} + {{Spec2('Resource Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.secureConnectionStart")}}

diff --git a/files/fr/web/api/performanceresourcetiming/servertiming/index.html b/files/fr/web/api/performanceresourcetiming/servertiming/index.html new file mode 100644 index 0000000000..7ff22aa4fa --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/servertiming/index.html @@ -0,0 +1,51 @@ +--- +title: PerformanceResourceTiming.serverTiming +slug: Web/API/PerformanceResourceTiming/serverTiming +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - SecureContextOnly + - serverTiming +translation_of: Web/API/PerformanceResourceTiming/serverTiming +--- +
{{APIRef("Resource Timing API")}} {{securecontext_header}}
+ +

La propriété en lecture seule serverTiming retourne un tableau d'entrées PerformanceServerTiming contenant des mesures de synchronisation du serveur.

+ +

Syntaxe

+ +
resource.serverTiming;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Server Timing','#servertiming-attribute', 'serverTiming')}}{{Spec2('Server Timing')}}Initial definition.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.serverTiming")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performanceresourcetiming/tojson/index.html b/files/fr/web/api/performanceresourcetiming/tojson/index.html new file mode 100644 index 0000000000..224bf123bc --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/tojson/index.html @@ -0,0 +1,67 @@ +--- +title: PerformanceResourceTiming.toJSON() +slug: Web/API/PerformanceResourceTiming/toJSON +tags: + - API + - Method + - Méthode + - Reference + - Performance Web + - Resource Timing API + - toJSON() +translation_of: Web/API/PerformanceResourceTiming/toJSON +--- +
{{APIRef("Resource Timing API")}}
+ +

La méthode toJSON() est un sérialiseur qui retourne une représentation JSON de l'objet PerformanceResourceTiming.

+ +

Syntaxe

+ +
let json = resourcePerfEntry.toJSON();
+ +

Arguments

+ +

Aucun.

+ +

Valeur de retour

+ +
+
json
+
Un objet JSON qui est la sérialisation de l'objet PerformanceResourceTiming comme une carte avec des entrées de l'interface héritée la plus proche et avec des entrées pour chacun des attributs sérialisables.
+
+ +

Exemple

+ +
// Obtient une entrée de performance des ressources
+let perfEntries = performance.getEntriesByType("resource");
+let entry = perfEntries[0];
+
+// Récupère le JSON et l'enregistre
+let json = entry.toJSON();
+let s = JSON.stringify(json);
+console.log("PerformanceEntry.toJSON = " + s);
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing 2', '#dom-performanceresourcetiming-tojson', + 'toJSON')}}{{Spec2('Resource Timing 2')}}
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performanceresourcetiming/transfersize/index.html b/files/fr/web/api/performanceresourcetiming/transfersize/index.html new file mode 100644 index 0000000000..87dfa3535e --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/transfersize/index.html @@ -0,0 +1,83 @@ +--- +title: PerformanceResourceTiming.transferSize +slug: Web/API/PerformanceResourceTiming/transferSize +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - transferSize +translation_of: Web/API/PerformanceResourceTiming/transferSize +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule transferSize représente la taille (en octets) de la ressource extraite. La taille comprend les champs d'en-tête de la réponse plus la charge utile du corps de la réponse (comme défini par la RFC 7230).

+ +

{{AvailableInWorkers}}

+ +

Si la ressource est extraite d'un cache local ou s'il s'agit d'une ressource d'origine croisée, cette propriété renvoie zéro.

+ +

Syntaxe

+ +
resource.transferSize;
+ +

Valeur de retour

+ +

Un number représentant la taille (en octets) de la ressource extraite. La taille comprend les champs d'en-tête de la réponse plus la taille de la charge utile du corps de la réponse (RFC7230).

+ +

Exemple

+ +

Dans l'exemple suivant, les valeurs des propriétés de taille de tous les types "resource" sont enregistrées.

+ +
function log_sizes(perfEntry){
+  // Vérifie la prise en charge des propriétés PerformanceEntry.*size et imprime leurs valeurs
+  // si elles sont prises en charge
+  if ("decodedBodySize" in perfEntry)
+    console.log("decodedBodySize = " + perfEntry.decodedBodySize);
+  else
+    console.log("decodedBodySize = N'EST PAS pris en charge");
+
+  if ("encodedBodySize" in perfEntry)
+    console.log("encodedBodySize = " + perfEntry.encodedBodySize);
+  else
+    console.log("encodedBodySize = N'EST PAS pris en charge");
+
+  if ("transferSize" in perfEntry)
+    console.log("transferSize = " + perfEntry.transferSize);
+  else
+    console.log("transferSize = N'EST PAS pris en charge");
+}
+function check_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    log_sizes(p[i]);
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing 2', '#dom-performanceresourcetiming-transfersize', + 'transferSize')}}{{Spec2('Resource Timing 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.transferSize")}}

diff --git a/files/fr/web/api/performanceresourcetiming/workerstart/index.html b/files/fr/web/api/performanceresourcetiming/workerstart/index.html new file mode 100644 index 0000000000..086f82b9b7 --- /dev/null +++ b/files/fr/web/api/performanceresourcetiming/workerstart/index.html @@ -0,0 +1,84 @@ +--- +title: PerformanceResourceTiming.workerStart +slug: Web/API/PerformanceResourceTiming/workerStart +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - workerStart +translation_of: Web/API/PerformanceResourceTiming/workerStart +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule workerStart de l'interface PerformanceResourceTiming renvoie un DOMHighResTimeStamp immédiatement avant l'envoi du FetchEvent si un processus de service worker est déjà en cours, ou immédiatement avant le démarrage du processus de service worker s'il n'est pas déjà en cours. Si la ressource n'est pas interceptée par un service worker, la propriété renvoie toujours 0.

+ +

{{AvailableInWorkers}}

+ +

Syntaxe

+ +
resource.workerStart;
+ +

Valeur de retour

+ +

Un DOMHighResTimeStamp immédiatement avant de transmettre le FetchEvent si un processus de service worker est déjà en cours, ou immédiatement avant de lancer le processus de service worker s'il n'est pas encore en cours. Si la ressource n'est pas interceptée par un service worker, la propriété retourne toujours 0.

+ +

Exemple

+ +

Dans l'exemple suivant, la valeur des propriétés *Start et *End de tous les événements de type "resource" sont enregistrés.

+ +
function print_PerformanceEntries() {
+  // Utilise getEntriesByType() pour obtenir uniquement les événements "resource"
+  let p = performance.getEntriesByType("resource");
+  for (let i = 0; i < p.length; i++) {
+    print_start_and_end_properties(p[i]);
+  }
+}
+function print_start_and_end_properties(perfEntry) {
+  // Imprime les horodatages des propriétés *start et *end
+  properties = ["connectStart", "connectEnd",
+                "domainLookupStart", "domainLookupEnd",
+                "fetchStart",
+                "redirectStart", "redirectEnd",
+                "requestStart",
+                "responseStart", "responseEnd",
+                "secureConnectionStart"];
+
+  for (let i = 0; i < properties.length; i++) {
+    // vérifie chaque propriété
+    let supported = properties[i] in perfEntry;
+    if (supported) {
+      let value = perfEntry[properties[i]];
+      console.log("... " + properties[i] + " = " + value);
+    } else {
+      console.log("... " + properties[i] + " = N'EST PAS pris en charge");
+    }
+  }
+}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Resource Timing 2', '#dom-performanceresourcetiming-workerstart', + 'workerStart')}}{{Spec2('Resource Timing 2')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceResourceTiming.workerStart")}}

diff --git a/files/fr/web/api/performanceservertiming/description/index.html b/files/fr/web/api/performanceservertiming/description/index.html new file mode 100644 index 0000000000..15919ceccd --- /dev/null +++ b/files/fr/web/api/performanceservertiming/description/index.html @@ -0,0 +1,51 @@ +--- +title: PerformanceServerTiming.description +slug: Web/API/PerformanceServerTiming/description +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - description +translation_of: Web/API/PerformanceServerTiming/description +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule description retourne une chaîne de caractères (DOMString) décrivant la métrique spécifiée par le serveur, ou une chaîne vide.

+ +

Syntaxe

+ +
serverTiming.description;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Server Timing','#dom-performanceservertiming-description', + 'description')}}{{Spec2('Server Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceServerTiming.description")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performanceservertiming/duration/index.html b/files/fr/web/api/performanceservertiming/duration/index.html new file mode 100644 index 0000000000..dc61670775 --- /dev/null +++ b/files/fr/web/api/performanceservertiming/duration/index.html @@ -0,0 +1,51 @@ +--- +title: PerformanceServerTiming.duration +slug: Web/API/PerformanceServerTiming/duration +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - duration +translation_of: Web/API/PerformanceServerTiming/duration +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule duration retourne un double qui contient la durée de la métrique spécifiée par le serveur, ou la valeur 0,0.

+ +

Syntaxe

+ +
serverTiming.duration;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Server Timing','#dom-performanceservertiming-duration', + 'duration')}}{{Spec2('Server Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceServerTiming.duration")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performanceservertiming/index.html b/files/fr/web/api/performanceservertiming/index.html new file mode 100644 index 0000000000..6f9bbd6e6f --- /dev/null +++ b/files/fr/web/api/performanceservertiming/index.html @@ -0,0 +1,98 @@ +--- +title: PerformanceServerTiming +slug: Web/API/PerformanceServerTiming +tags: + - API + - Interface + - Reference + - Performance Web + - Resource Timing API +translation_of: Web/API/PerformanceServerTiming +--- +
{{APIRef("Resource Timing API")}} {{securecontext_header}}
+ +

L'interface PerformanceServerTiming présente des métriques de serveur qui sont envoyées avec la réponse dans l'en-tête Server-Timing dans l'en-tête HTTP.

+ +

Cette interface est limitée à la même origine, mais vous pouvez utiliser l'en-tête Timing-Allow-Origin pour spécifier les domaines qui sont autorisés à accéder aux paramètres du serveur. Notez que cette interface n'est disponible que dans des contextes sécurisés (HTTPS) dans certains navigateurs.

+ +

{{AvailableInWorkers}}

+ +

Propriétés

+ +
+
PerformanceServerTiming.description{{readonlyInline}}
+
Une chaîne de caractères DOMString décrivant la métrique spécifiée par le serveur, ou une chaîne vide.
+
PerformanceServerTiming.duration{{readonlyInline}}
+
Un double qui contient la durée de la métrique spécifiée par le serveur, ou la valeur 0.0.
+
PerformanceServerTiming.name{{readonlyInline}}
+
Une chaîne de caractères DOMString avec le nom de la métrique spécifiée par le serveur.
+
+ +

Méthodes

+ +
+
PerformanceServerTiming.toJSON()
+
Retourne une chaîne de caractères DOMString qui est la représentation JSON de l'objet PerformanceServerTiming.
+
+ +

Exemple

+ +

Étant donné un serveur qui envoie l'en-tête Server-Timing, par exemple un serveur node.js comme celui-ci :

+ +
const http = require('http');
+
+function requestHandler(request, response) {
+  const headers = {
+    'Server-Timing': `
+      cache;desc="Cache Read";dur=23.2,
+      db;dur=53,
+      app;dur=47.2
+    `.replace(/\n/g, '')
+  };
+  response.writeHead(200, headers);
+  response.write('');
+  return setTimeout(_ => {
+    response.end();
+  }, 1000)
+};
+
+http.createServer(requestHandler).listen(3000).on('error', console.error);
+ +

Les entrées PerformanceServerTiming sont désormais observables depuis JavaScript via la propriété PerformanceResourceTiming.serverTiming :

+ +
let entries = performance.getEntriesByType('resource');
+console.log(entries[0].serverTiming);
+// 0: PerformanceServerTiming {name: "cache", duration: 23.2, description: "Cache Read"}
+// 1: PerformanceServerTiming {name: "db", duration: 53, description: ""}
+// 2: PerformanceServerTiming {name: "app", duration: 47.2, description: ""}
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Server Timing','#the-performanceservertiming-interface', 'PerformanceServerTiming')}}{{Spec2('Server Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performanceservertiming/name/index.html b/files/fr/web/api/performanceservertiming/name/index.html new file mode 100644 index 0000000000..4b8ec5b587 --- /dev/null +++ b/files/fr/web/api/performanceservertiming/name/index.html @@ -0,0 +1,50 @@ +--- +title: PerformanceServerTiming.name +slug: Web/API/PerformanceServerTiming/name +tags: + - API + - Property + - Propriété + - Reference + - Performance Web + - Resource Timing API + - name +translation_of: Web/API/PerformanceServerTiming/name +--- +
{{APIRef("Resource Timing API")}}
+ +

La propriété en lecture seule name retourne une valeur DOMString qui est le nom de la métrique spécifiée par le serveur.

+ +

Syntaxe

+ +
serverTiming.name;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Server Timing','#dom-performanceservertiming-name', 'name')}}{{Spec2('Server Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceServerTiming.name")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performanceservertiming/tojson/index.html b/files/fr/web/api/performanceservertiming/tojson/index.html new file mode 100644 index 0000000000..0b7773e322 --- /dev/null +++ b/files/fr/web/api/performanceservertiming/tojson/index.html @@ -0,0 +1,55 @@ +--- +title: PerformanceServerTiming.toJSON() +slug: Web/API/PerformanceServerTiming/toJSON +tags: + - API + - Method + - Méthode + - Reference + - Performance Web + - Resource Timing API + - toJSON +translation_of: Web/API/PerformanceServerTiming/toJSON +--- +
{{APIRef("Resource Timing API")}}
+ +

La méthode toJSON() de l'interface PerformanceServerTiming retourne une chaîne de caractères DOMString qui est la représentation JSON de l'objet PerformanceServerTiming.

+ +

Syntaxe

+ +
let json = PerformanceServerTiming.toJSON()
+ +

Paramètres

+ +

Aucun.

+ +

Valeur de retour

+ +
+
json
+
Une chaîne de caractères JSON qui est la sérialisation de l'objet PerformanceServerTiming.
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Server Timing','#dom-performanceservertiming-tojson','toJSON')}} + {{Spec2('Server Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

diff --git a/files/fr/web/api/performancetiming/connectend/index.html b/files/fr/web/api/performancetiming/connectend/index.html new file mode 100644 index 0000000000..6ac529c501 --- /dev/null +++ b/files/fr/web/api/performancetiming/connectend/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.connectEnd +slug: Web/API/PerformanceTiming/connectEnd +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - connectEnd +translation_of: Web/API/PerformanceTiming/connectEnd +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule connectEnd retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où la connexion a été ouverte en réseau. Si la couche de transport signale une erreur et que l'établissement de la connexion est recommencé, l'heure de fin du dernier établissement de la connexion est donnée. Si une connexion persistante est utilisée, la valeur sera la même que PerformanceTiming.fetchStart. Une connexion est considérée comme ouverte lorsque toute poignée de main de connexion sécurisée, ou authentification SOCKS, est terminée.

+ +

Syntaxe

+ +
let time = performanceTiming.connectEnd;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-connectend', + 'PerformanceTiming.connectEnd')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.connectEnd")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/connectstart/index.html b/files/fr/web/api/performancetiming/connectstart/index.html new file mode 100644 index 0000000000..bd8848d20a --- /dev/null +++ b/files/fr/web/api/performancetiming/connectstart/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.connectStart +slug: Web/API/PerformanceTiming/connectStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - connectStart +translation_of: Web/API/PerformanceTiming/connectStart +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule connectStart retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où la demande d'ouverture de connexion est envoyée au réseau. Si la couche transport signale une erreur et que l'établissement de la connexion est relancé, le dernier moment de début d'établissement de la connexion est donné. Si une connexion persistante est utilisée, la valeur sera la même que PerformanceTiming.fetchStart.

+ +

Syntaxe

+ +
let time = performanceTiming.connectStart;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-connectstart', + 'PerformanceTiming.connectStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.connectStart")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/domainlookupend/index.html b/files/fr/web/api/performancetiming/domainlookupend/index.html new file mode 100644 index 0000000000..6bddef76dd --- /dev/null +++ b/files/fr/web/api/performancetiming/domainlookupend/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.domainLookupEnd +slug: Web/API/PerformanceTiming/domainLookupEnd +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - domainLookupEnd +translation_of: Web/API/PerformanceTiming/domainLookupEnd +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule domainLookupEnd retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où la recherche de domaine est terminée. Si une connexion persistante est utilisée, ou si les informations sont stockées dans un cache ou une ressource locale, la valeur sera la même que PerformanceTiming.fetchStart.

+ +

Syntaxe

+ +
let time = performanceTiming.domainLookupEnd;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-domainlookupend', + 'PerformanceTiming.domainLookupEnd')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.domainLookupEnd")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/domainlookupstart/index.html b/files/fr/web/api/performancetiming/domainlookupstart/index.html new file mode 100644 index 0000000000..d35d4eac99 --- /dev/null +++ b/files/fr/web/api/performancetiming/domainlookupstart/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.domainLookupStart +slug: Web/API/PerformanceTiming/domainLookupStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - domainLookupStart +translation_of: Web/API/PerformanceTiming/domainLookupStart +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule domainLookupStart retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où la recherche de domaine commence. Si une connexion persistante est utilisée, ou si les informations sont stockées dans un cache ou une ressource locale, la valeur sera la même que PerformanceTiming.fetchStart.

+ +

Syntaxe

+ +
let time = performanceTiming.domainLookupStart;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-domainlookupstart', + 'PerformanceTiming.domainLookupStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.domainLookupStart")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/domcomplete/index.html b/files/fr/web/api/performancetiming/domcomplete/index.html new file mode 100644 index 0000000000..a8b3d0b028 --- /dev/null +++ b/files/fr/web/api/performancetiming/domcomplete/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.domComplete +slug: Web/API/PerformanceTiming/domComplete +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - domComplete +translation_of: Web/API/PerformanceTiming/domComplete +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser la propriété PerformanceNavigationTiming.domComplete de l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule domComplete retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où le parseur a terminé son travail sur le document principal, c'est-à-dire lorsque son Document.readyState passe à 'complete' et que l'événement readystatechange correspondant est lancé.

+ +

Syntaxe

+ +
let time = performanceTiming.domComplete;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-domcomplete', + 'PerformanceTiming.domComplete')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.domComplete")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/domcontentloadedeventend/index.html b/files/fr/web/api/performancetiming/domcontentloadedeventend/index.html new file mode 100644 index 0000000000..d09d8e22c6 --- /dev/null +++ b/files/fr/web/api/performancetiming/domcontentloadedeventend/index.html @@ -0,0 +1,58 @@ +--- +title: PerformanceTiming.domContentLoadedEventEnd +slug: Web/API/PerformanceTiming/domContentLoadedEventEnd +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - domContentLoadedEventEnd +translation_of: Web/API/PerformanceTiming/domContentLoadedEventEnd +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser la propriété PerformanceNavigationTiming.domContentLoadedEventEnd de l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule domContentLoadedEventEnd retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, juste après que tous les scripts qui doivent être exécutés le plus rapidement possible, dans l'ordre ou non, aient été exécutés.

+ +

Syntaxe

+ +
let time = performanceTiming.domContentLoadedEventEnd;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', + '#dom-performancetiming-domcontentloadedeventend', + 'PerformanceTiming.domContentLoadedEventEnd')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.domContentLoadedEventEnd")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/domcontentloadedeventstart/index.html b/files/fr/web/api/performancetiming/domcontentloadedeventstart/index.html new file mode 100644 index 0000000000..e19dca26ee --- /dev/null +++ b/files/fr/web/api/performancetiming/domcontentloadedeventstart/index.html @@ -0,0 +1,58 @@ +--- +title: PerformanceTiming.domContentLoadedEventStart +slug: Web/API/PerformanceTiming/domContentLoadedEventStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - domContentLoadedEventStart +translation_of: Web/API/PerformanceTiming/domContentLoadedEventStart +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser la propriété PerformanceNavigationTiming.domContentLoadedEventStart de l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule domContentLoadedEventStart retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, juste avant que le parseur n'envoie l'événement DOMContentLoaded, c'est-à-dire juste après que tous les scripts qui doivent être exécutés juste après le parsing aient été exécutés.

+ +

Syntaxe

+ +
let time = performanceTiming.domContentLoadedEventStart;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', + '#dom-performancetiming-domcontentloadedeventstart', + 'PerformanceTiming.domContentLoadedEventStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.domContentLoadedEventStart")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/dominteractive/index.html b/files/fr/web/api/performancetiming/dominteractive/index.html new file mode 100644 index 0000000000..87e2648a84 --- /dev/null +++ b/files/fr/web/api/performancetiming/dominteractive/index.html @@ -0,0 +1,61 @@ +--- +title: PerformanceTiming.domInteractive +slug: Web/API/PerformanceTiming/domInteractive +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - domInteractive +translation_of: Web/API/PerformanceTiming/domInteractive +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser la propriété PerformanceNavigationTiming.domInteractive de l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule domInteractive retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où le parseur a terminé son travail sur le document principal, c'est-à-dire lorsque son Document.readyState passe à "interactive" et que l'événement readystatechange correspondant est lancé.

+ +

Cette propriété peut être utilisée pour mesurer la vitesse de chargement des sites Web que les utilisateurs ressentent. Néanmoins, il y a quelques mises en garde qui se produisent si des scripts bloquent le rendu et ne sont pas chargés de manière asynchrone ou avec des polices Web personnalisées. Vérifiez si vous êtes dans l'un de ces cas avant d'utiliser cette propriété comme un proxy pour l'expérience utilisateur de la vitesse de chargement d'un site Web.

+ +

Syntaxe

+ +
let time = performanceTiming.domInteractive;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-dominteractive', + 'PerformanceTiming.domInteractive')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.domInteractive")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/domloading/index.html b/files/fr/web/api/performancetiming/domloading/index.html new file mode 100644 index 0000000000..7e252ffe86 --- /dev/null +++ b/files/fr/web/api/performancetiming/domloading/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.domLoading +slug: Web/API/PerformanceTiming/domLoading +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - domLoading +translation_of: Web/API/PerformanceTiming/domLoading +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule domLoading retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où le parseur a commencé son travail, c'est-à-dire lorsque son Document.readyState passe à "loading" et que l'événement readystatechange correspondant est déclenché.

+ +

Syntaxe

+ +
let time = performanceTiming.domLoading;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-domloading', + 'PerformanceTiming.domLoading')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.domLoading")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/fetchstart/index.html b/files/fr/web/api/performancetiming/fetchstart/index.html new file mode 100644 index 0000000000..5b8193e731 --- /dev/null +++ b/files/fr/web/api/performancetiming/fetchstart/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.fetchStart +slug: Web/API/PerformanceTiming/fetchStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - fetchStart +translation_of: Web/API/PerformanceTiming/fetchStart +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule fetchStart retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où le navigateur est prêt à aller chercher le document en utilisant une requête HTTP. Ce moment est avant la vérification de tout cache d'application.

+ +

Syntaxe

+ +
let time = performance.timing.fetchStart;
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-fetchstart', + 'PerformanceTiming.fetchStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.fetchStart")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/index.html b/files/fr/web/api/performancetiming/index.html new file mode 100644 index 0000000000..a743e13d51 --- /dev/null +++ b/files/fr/web/api/performancetiming/index.html @@ -0,0 +1,117 @@ +--- +title: PerformanceTiming +slug: Web/API/PerformanceTiming +tags: + - API + - Backwards compatibility + - Deprecated + - Interface + - Navigation Timing + - Navigation Timing API + - Optimization + - Performance + - Reference + - Timing + - legacy +translation_of: Web/API/PerformanceTiming +--- +
{{APIRef("Navigation Timing")}}
+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'interface PerformanceTiming est une interface héritée conservée pour la rétrocompatibilité et contient des propriétés qui offrent des informations sur la chronologie des performances pour divers événements qui se produisent pendant le chargement et l'utilisation de la page actuelle. Vous obtenez un objet PerformanceTiming décrivant votre page en utilisant la propriété window.performance.timing.

+ +

Propriétés

+ +

L'interface PerformanceTiming n'hérite d'aucune propriété.

+ +

Ces propriétés décrivent chacune l'heure à laquelle un point particulier du processus de chargement de la page a été atteint. Certaines correspondent à des événements DOM, d'autres décrivent l'heure à laquelle les opérations internes du navigateur ont eu lieu.

+ +

Chaque heure est fournie sous la forme d'une heure Unix (unsigned long long) représentant le moment, en millisecondes depuis l'époque UNIX.

+ +

Ces propriétés sont énumérées dans l'ordre dans lequel elles apparaissent au cours du processus de navigation.

+ +
+
PerformanceTiming.navigationStart {{readonlyInline}} {{deprecated_inline}}
+
Lorsque le prompt de déchargement se termine sur le document précédent dans le même contexte de navigation. S'il n'y a pas de document précédent, cette valeur sera la même que PerformanceTiming.fetchStart.
+
PerformanceTiming.unloadEventStart {{readonlyInline}} {{deprecated_inline}}
+
Lorsque l'événement unload a été lancé, indiquant l'heure à laquelle le document précédent dans la fenêtre a commencé à se décharger. S'il n'y a pas de document précédent, ou si le document précédent ou l'une des redirections nécessaires n'est pas de la même origine, la valeur retournée est 0.
+
PerformanceTiming.unloadEventEnd {{readonlyInline}} {{deprecated_inline}}
+
Lorsque le gestionnaire d'événement unload se termine. S'il n'y a pas de document précédent, ou si le document précédent, ou l'une des redirections nécessaires, n'est pas de la même origine, la valeur retournée est 0.
+
PerformanceTiming.redirectStart {{readonlyInline}} {{deprecated_inline}}
+
Quand la première redirection HTTP commence. S'il n'y a pas de redirection, ou si l'une des redirections n'est pas de la même origine, la valeur retournée est 0.
+
PerformanceTiming.redirectEnd {{readonlyInline}} {{deprecated_inline}}
+
Lorsque la dernière redirection HTTP est terminée, c'est-à-dire lorsque le dernier octet de la réponse HTTP a été reçu. S'il n'y a pas de redirection, ou si l'une des redirections n'a pas la même origine, la valeur retournée est 0.
+
PerformanceTiming.fetchStart {{readonlyInline}} {{deprecated_inline}}
+
Lorsque le navigateur est prêt à récupérer le document à l'aide d'une requête HTTP. Ce moment est avant la vérification de tout cache d'application.
+
PerformanceTiming.domainLookupStart {{readonlyInline}} {{deprecated_inline}}
+
Lorsque la recherche du domaine commence. Si une connexion persistante est utilisée, ou si les informations sont stockées dans un cache ou une ressource locale, la valeur sera la même que PerformanceTiming.fetchStart.
+
PerformanceTiming.domainLookupEnd {{readonlyInline}} {{deprecated_inline}}
+
Lorsque la recherche du domaine est terminée. Si une connexion persistante est utilisée, ou si les informations sont stockées dans un cache ou une ressource locale, la valeur sera la même que PerformanceTiming.fetchStart.
+
PerformanceTiming.connectStart {{readonlyInline}} {{deprecated_inline}}
+
Lorsque la demande d'ouverture d'une connexion est envoyée au réseau. Si la couche de transport signale une erreur et que l'établissement de la connexion est relancé, la dernière heure de début d'établissement de la connexion est donnée. Si une connexion persistante est utilisée, la valeur sera la même que PerformanceTiming.fetchStart.
+
PerformanceTiming.connectEnd {{readonlyInline}} {{deprecated_inline}}
+
Lorsque la connexion est ouverte sur le réseau. Si la couche transport signale une erreur et que l'établissement de la connexion est relancé, l'heure de fin du dernier établissement de la connexion est donnée. Si une connexion persistante est utilisée, la valeur sera la même que PerformanceTiming.fetchStart. Une connexion est considérée comme ouverte lorsque toute poignée de main de connexion sécurisée, ou authentification SOCKS, est terminée.
+
PerformanceTiming.secureConnectionStart {{readonlyInline}} {{deprecated_inline}}
+
Lorsque le handshake de connexion sécurisée commence. Si aucune connexion de ce type n'est demandée, il retourne 0.
+
PerformanceTiming.requestStart {{readonlyInline}} {{deprecated_inline}}
+
Lorsque le navigateur a envoyé la requête pour obtenir le document réel, depuis le serveur ou depuis un cache. Si la couche de transport échoue après le début de la demande et que la connexion est rouverte, cette propriété sera définie sur l'heure correspondant à la nouvelle demande.
+
PerformanceTiming.responseStart {{readonlyInline}} {{deprecated_inline}}
+
Lorsque le navigateur a reçu le premier octet de la réponse, du serveur ou d'un cache, ou d'une ressource locale.
+
PerformanceTiming.responseEnd {{readonlyInline}} {{deprecated_inline}}
+
Lorsque le navigateur a reçu le dernier octet de la réponse, ou lorsque la connexion est fermée si cela s'est produit en premier, depuis le serveur, le cache ou une ressource locale.
+
PerformanceTiming.domLoading {{readonlyInline}} {{deprecated_inline}}
+
Lorsque l'analyseur syntaxique a commencé son travail, c'est-à-dire lorsque son Document.readyState passe à 'loading' et que l'événement readystatechange correspondant est déclenché.
+
PerformanceTiming.domInteractive {{readonlyInline}} {{deprecated_inline}}
+
Lorsque l'analyseur syntaxique a terminé son travail sur le document principal, c'est à ce moment que son Document.readyState passe à 'interactive' et que l'événement readystatechange correspondant est lancé.
+
PerformanceTiming.domContentLoadedEventStart {{readonlyInline}} {{deprecated_inline}}
+
Juste avant que l'analyseur syntaxique envoie l'événement DOMContentLoaded, c'est-à-dire juste après que tous les scripts qui doivent être exécutés juste après l'analyse syntaxique aient été exécutés.
+
PerformanceTiming.domContentLoadedEventEnd {{readonlyInline}} {{deprecated_inline}}
+
C'est-à-dire juste après que tous les scripts qui doivent être exécutés dès que possible, dans l'ordre ou non, aient été exécutés.
+
PerformanceTiming.domComplete {{readonlyInline}} {{deprecated_inline}}
+
Lorsque l'analyseur syntaxique a terminé son travail sur le document principal, c'est-à-dire lorsque son Document.readyState passe à 'complete' et que l'événement readystatechange correspondant est lancé.
+
PerformanceTiming.loadEventStart {{readonlyInline}} {{deprecated_inline}}
+
Quand l'événement load a été envoyé pour le document actuel. Si cet événement n'a pas encore été envoyé, il retourne 0.
+
PerformanceTiming.loadEventEnd {{readonlyInline}} {{deprecated_inline}}
+
Lorsque le gestionnaire d'événement load s'est terminé, c'est-à-dire lorsque l'événement de chargement est terminé. Si cet événement n'a pas encore été envoyé, ou n'est pas encore terminé, il retourne 0.
+
+ +

Méthodes

+ +

L'interface PerformanceTiming n'hérite d'aucune méthode.

+ +
+
PerformanceTiming.toJSON() {{non-Standard_Inline}} {{deprecated_inline}}
+
Retourne un objet JSON représentant cet objet PerformanceTiming.
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#performancetiming', 'PerformanceTiming')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/loadeventend/index.html b/files/fr/web/api/performancetiming/loadeventend/index.html new file mode 100644 index 0000000000..46df8ff041 --- /dev/null +++ b/files/fr/web/api/performancetiming/loadeventend/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.loadEventEnd +slug: Web/API/PerformanceTiming/loadEventEnd +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - loadEventEnd +translation_of: Web/API/PerformanceTiming/loadEventEnd +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser la propriété PerformanceNavigationTiming.loadEventEnd de l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule loadEventEnd retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où le gestionnaire d'événement load s'est terminé, c'est-à-dire lorsque l'événement de chargement est terminé. Si cet événement n'a pas encore été envoyé, ou n'est pas encore terminé, il retourne 0.

+ +

Syntaxe

+ +
let time = performanceTiming.loadEventEnd;
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-loadedeventend', + 'PerformanceTiming.loadEventEnd')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.loadEventEnd")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/loadeventstart/index.html b/files/fr/web/api/performancetiming/loadeventstart/index.html new file mode 100644 index 0000000000..037c50dbe1 --- /dev/null +++ b/files/fr/web/api/performancetiming/loadeventstart/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.loadEventStart +slug: Web/API/PerformanceTiming/loadEventStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - loadEventStart +translation_of: Web/API/PerformanceTiming/loadEventStart +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser la propriété PerformanceNavigationTiming.loadEventStart de l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule loadEventStart retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où l'événement load a été envoyé pour le document actuel. Si cet événement n'a pas encore été envoyé, il retourne 0.

+ +

Syntaxe

+ +
let time = performanceTiming.loadEventStart;
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-loadeventstart', + 'PerformanceTiming.loadEventStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.loadEventStart")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/navigationstart/index.html b/files/fr/web/api/performancetiming/navigationstart/index.html new file mode 100644 index 0000000000..1ce9e75b82 --- /dev/null +++ b/files/fr/web/api/performancetiming/navigationstart/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.navigationStart +slug: Web/API/PerformanceTiming/navigationStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - navigationStart +translation_of: Web/API/PerformanceTiming/navigationStart +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule navigationStart retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, juste après la fin de l'invite de déchargement sur le document précédent dans le même contexte de navigation. S'il n'y a pas de document précédent, cette valeur sera la même que PerformanceTiming.fetchStart.

+ +

Syntaxe

+ +
let time = performanceTiming.navigationStart;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-navigationstart', + 'PerformanceTiming.navigationStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.navigationStart")}}

+ +

Voir aussi

+ + \ No newline at end of file diff --git a/files/fr/web/api/performancetiming/redirectend/index.html b/files/fr/web/api/performancetiming/redirectend/index.html new file mode 100644 index 0000000000..84cea2911a --- /dev/null +++ b/files/fr/web/api/performancetiming/redirectend/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.redirectEnd +slug: Web/API/PerformanceTiming/redirectEnd +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - redirectEnd +translation_of: Web/API/PerformanceTiming/redirectEnd +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule redirectEnd retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où la dernière redirection HTTP est terminée, c'est-à-dire lorsque le dernier octet de la réponse HTTP a été reçu. S'il n'y a pas de redirection, ou si l'une des redirections n'est pas de la même origine, la valeur renvoyée est 0.

+ +

Syntaxe

+ +
let time = performanceTiming.redirectEnd;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-redirectend', + 'PerformanceTiming.redirectEnd')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.redirectEnd")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/redirectstart/index.html b/files/fr/web/api/performancetiming/redirectstart/index.html new file mode 100644 index 0000000000..35bdf3f8db --- /dev/null +++ b/files/fr/web/api/performancetiming/redirectstart/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.redirectStart +slug: Web/API/PerformanceTiming/redirectStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - redirectStart +translation_of: Web/API/PerformanceTiming/redirectStart +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule redirectStart retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où la première redirection HTTP commence. S'il n'y a pas de redirection, ou si l'une des redirections n'est pas de la même origine, la valeur renvoyée est 0.

+ +

Syntaxe

+ +
let time = performanceTiming.redirectStart;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-redirectstart', + 'PerformanceTiming.redirectStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.redirectStart")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/requeststart/index.html b/files/fr/web/api/performancetiming/requeststart/index.html new file mode 100644 index 0000000000..96ce2e454a --- /dev/null +++ b/files/fr/web/api/performancetiming/requeststart/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.requestStart +slug: Web/API/PerformanceTiming/requestStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - requestStart +translation_of: Web/API/PerformanceTiming/requestStart +--- +

{{ APIRef("PerformanceTiming") }}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule requestStart retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où le navigateur a envoyé la requête pour obtenir le document actuel, depuis le serveur ou depuis un cache. Si la couche de transport échoue après le début de la requête et que la connexion est rouverte, cette propriété sera définie sur le temps correspondant à la nouvelle requête.

+ +

Syntaxe

+ +
let time = performanceTiming.requestStart;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-requeststart', + 'PerformanceTiming.requestStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.requestStart")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/responseend/index.html b/files/fr/web/api/performancetiming/responseend/index.html new file mode 100644 index 0000000000..b4b1d436d3 --- /dev/null +++ b/files/fr/web/api/performancetiming/responseend/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.responseEnd +slug: Web/API/PerformanceTiming/responseEnd +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - responseEnd +translation_of: Web/API/PerformanceTiming/responseEnd +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule responseEnd retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où le navigateur a reçu le dernier octet de la réponse, ou lorsque la connexion est fermée si cela s'est produit en premier, depuis le serveur à partir d'un cache ou d'une ressource locale.

+ +

Syntaxe

+ +
let time = performanceTiming.responseEnd;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-responseEnd', + 'PerformanceTiming.responseEnd')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.responseEnd")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/responsestart/index.html b/files/fr/web/api/performancetiming/responsestart/index.html new file mode 100644 index 0000000000..e5130ffc08 --- /dev/null +++ b/files/fr/web/api/performancetiming/responsestart/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.responseStart +slug: Web/API/PerformanceTiming/responseStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - responseStart +translation_of: Web/API/PerformanceTiming/responseStart +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule responseStart retourne un unsigned long long représentant le moment (en millisecondes depuis l'époque UNIX) où le navigateur a reçu le premier octet de la réponse du serveur, du cache ou de la ressource locale.

+ +

Syntaxe

+ +
let time = performanceTiming.responseStart;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-responsestart', + 'PerformanceTiming.responseStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.responseStart")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/secureconnectionstart/index.html b/files/fr/web/api/performancetiming/secureconnectionstart/index.html new file mode 100644 index 0000000000..c23334901d --- /dev/null +++ b/files/fr/web/api/performancetiming/secureconnectionstart/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.secureConnectionStart +slug: Web/API/PerformanceTiming/secureConnectionStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - secureConnectionStart +translation_of: Web/API/PerformanceTiming/secureConnectionStart +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule secureConnectionStart retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où la poignée de main de connexion sécurisée commence. Si aucune connexion de ce type n'est demandée, elle retourne 0.

+ +

Syntaxe

+ +
let time = performanceTiming.secureConnectionStart;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-secureconnectionstart', + 'PerformanceTiming.secureConnectionStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.secureConnectionStart")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/unloadeventend/index.html b/files/fr/web/api/performancetiming/unloadeventend/index.html new file mode 100644 index 0000000000..6ecbcdfe0e --- /dev/null +++ b/files/fr/web/api/performancetiming/unloadeventend/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.unloadEventEnd +slug: Web/API/PerformanceTiming/unloadEventEnd +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - unloadEventEnd +translation_of: Web/API/PerformanceTiming/unloadEventEnd +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser la propriété PerformanceNavigationTiming.unloadEventEnd de l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule unloadEventEnd retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où le gestionnaire d'événement unload se termine. S'il n'y a pas de document précédent, ou si le document précédent, ou l'une des redirections nécessaires, n'est pas de la même origine, la valeur retournée est 0.

+ +

Syntaxe

+ +
let time = performanceTiming.unloadEventEnd;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-unloadeventend', + 'PerformanceTiming.unloadEventEnd')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.unloadEventEnd")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/performancetiming/unloadeventstart/index.html b/files/fr/web/api/performancetiming/unloadeventstart/index.html new file mode 100644 index 0000000000..432ccc7870 --- /dev/null +++ b/files/fr/web/api/performancetiming/unloadeventstart/index.html @@ -0,0 +1,57 @@ +--- +title: PerformanceTiming.unloadEventStart +slug: Web/API/PerformanceTiming/unloadEventStart +tags: + - API + - Backwards compatibility + - Deprecated + - Navigation Timing + - PerformanceTiming + - Property + - Propriété + - Read-only + - legacy + - unloadEventStart +translation_of: Web/API/PerformanceTiming/unloadEventStart +--- +

{{APIRef("Navigation Timing")}}

+ +
+

Attention : Cette interface est dépréciée dans la spécification Navigation Timing Level 2. Veuillez utiliser la propriété PerformanceNavigationTiming.unloadEventStart de l'interface PerformanceNavigationTiming à la place.

+
+ +

L'ancienne propriété en lecture seule unloadEventStart retourne un unsigned long long représentant le moment, en millisecondes depuis l'époque UNIX, où l'événement unload a été lancé. S'il n'y a pas de document précédent, ou si le document précédent, ou l'une des redirections nécessaires, n'est pas de la même origine, la valeur retournée est 0.

+ +

Syntaxe

+ +
let time = performanceTiming.unloadEventStart;
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Navigation Timing', '#dom-performancetiming-unloadeventstart', + 'PerformanceTiming.unloadEventStart')}}{{Spec2('Navigation Timing')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.PerformanceTiming.unloadEventStart")}}

+ +

Voir aussi

+ + -- cgit v1.2.3-54-g00ecf