L’objet window.performance permet d’accéder à différentes informations liées aux accès réseaux, aux temps de traitement côté client et aux informations de navigation.
performance.timing
Cet objet permet de récupérer des informations concernant le chargement de la page en cours. Il contient notamment les propriétés suivantes :
- connectEnd
- connectStart
- domComplete
- domLoading
- navigationStart
- requestStart
- responseEnd
- responseStart
Cette spécification officielle du W3C décrit la liste des attributs de cet objet.
performance.navigation
Cet objet permet de rassembler des informations relatives à la navigation :
- redirectCount : le nombre de redirections
- type : le type de navigation (TYPE_BACK_FORWARD, TYPE_NAVIGATE, TYPE_RELOAD, TYPE_RESERVED)
performance.getEntries()
Cette méthode permet de récupérer la liste des appels réseaux effectués par le navigateur pour charger une ressource (Javascript, CSS, images, … ) ou bien un appel asynchrone. Chaque élément de cette liste contient notamment les informations suivantes :
- connectEnd
- connectStart
- duration
- entryType (http://www.w3.org/wiki/Web_Performance/EntryType)
- fetchStart
- initiatorType
- name
- requestStart
- responseEnd
- responseStart
- startTime
Une explication détaillée de cet objet est disponible sur la documentation officielle du navigateur Google Chrome.
Cette technique a été utilisé dans l’implémentation du plugin Network Monitor du projet VorlonJS. Voici un exemple de rendu possible pour le site StackOverflow.
Conclusion
En résumé il est possible d’utiliser ce nouvel objet afin de réaliser un diagramme en cascade comme peuvent le faire les outils de développements du navigateur ou bien insérer ces données en base afin d’en faire des statistiques plus globales.
