Dans Chrome 58, qui est actuellement en version Canary, le panneau "Timeline" a été renommé "Performance", le panneau "Profiles" a été renommé "Memory" et la fonctionnalité d'enregistrement de profil de processeur JavaScript du panneau "Profiles" a été déplacée vers un emplacement plus masqué.
L'objectif à long terme est de supprimer l'ancien Profileur de processeur JavaScript et de permettre à tout le monde de travailler avec le nouveau workflow.
Ce petit guide de migration vous explique comment enregistrer un profil JS dans le panneau "Performances" et comment l'interface utilisateur du panneau "Performances" est mise en correspondance avec l'ancien workflow.
Accéder à l'ancien profileur de processeur JavaScript
Si vous préférez l'ancien workflow "Record JavaScript CPU Profile" (Enregistrer un profil de processeur JavaScript) qui était auparavant disponible dans le panneau "Profiles", vous pouvez toujours y accéder comme suit:
- Ouvrez le menu principal des outils de développement.
- Sélectionnez Plus d'outils > Profileur JavaScript. L'ancien profileur s'ouvre dans un nouveau panneau appelé Profileur JavaScript.
Comment enregistrer un profil JS
- Accédez aux Outils de développement.
Cliquez sur l'onglet Performances.
Enregistrez l'une des façons suivantes:
- Pour profiler un chargement de page, cliquez sur Enregistrer le chargement de page. Les outils de développement démarrent automatiquement l'enregistrement, puis s'arrêtent automatiquement lorsqu'ils détectent que le chargement de la page est terminé.
- Pour profiler une page en cours d'exécution, cliquez sur Record (Enregistrer), effectuez les actions que vous souhaitez profiler, puis cliquez sur Stop (Arrêter) lorsque vous avez terminé.
Correspondance entre l'ancien workflow et le nouveau
Dans la vue Graphique de l'ancien workflow, la capture d'écran ci-dessous vous montre la position du graphique de présentation de l'utilisation du processeur (flèche du haut) et du graphique de flammes (flèche du bas) dans le nouveau workflow.
La vue heavy (Bottom Up) (ascendant) est disponible dans l'onglet Bottom-Up (ascendant) :
Enfin, la vue Arborescence (descendante) est disponible dans l'onglet Arborescence d'appel:
Pinguez @ChromeDevTools sur Twitter ou signalez un problème GitHub dans notre dépôt de documents si nous avons manqué des fonctionnalités ou si vous avez d'autres questions concernant cet article.