Nouveautés des outils de développement, Chrome 126

Améliorations apportées au panneau "Performances"

Cette version apporte plusieurs améliorations au panneau Performances.

Déplacer et masquer des pistes avec le nouveau mode de configuration des pistes

Vous pouvez désormais accéder au mode de configuration des canaux en effectuant un clic droit sur le nom du canal et en sélectionnant Configurer les canaux. Le bouton "Modifier" qui nécessitait de l'espace supplémentaire a été supprimé.

Le mode de configuration des pistes vous permet de modifier l'ordre des pistes et de les masquer. Cliquez sur la flèche arrow_upward vers le haut ou arrow_downward vers le bas pour déplacer le tracé, ou cliquez sur Masquer visibility_off. Pour quitter le mode de configuration, cliquez sur Terminer la configuration des canaux en bas de la page. Cette configuration persiste pour les nouvelles traces, mais pas pour les prochaines sessions DevTools.

Problème Chromium : 336266699.

Ignorer les scripts dans le graphique de type "flamme"

Le graphique de type "flamme" du canal Main est compatible avec les listes d'éléments à ignorer. Vous pouvez maintenant effectuer un clic droit sur un script dans le graphique, puis sélectionner Ajouter un script à la liste des éléments à ignorer.

Le graphique réduit les scripts ignorés, les marque comme Dans la liste d'éléments à ignorer et les ajoute aux Règles d'exclusion personnalisées dans Paramètres > Paramètres > Liste d'éléments à ignorer. Les scripts ignorés sont conservés jusqu'à ce que vous les supprimiez de la trace ou des règles d'exclusion personnalisées.

Problème Chromium: 336266714.

Limiter le CPU 20 fois

Le menu de limitation du processeur dans Paramètres de capture du panneau Performances dispose d'une nouvelle option Ralenti x20. Vous pouvez ainsi reproduire et analyser avec plus de précision des problèmes de performances réels, même sur des ordinateurs haut de gamme.

Problème Chromium : 324978881.

Le panneau "Informations sur les performances" sera abandonné

Le panneau expérimental Informations sur les performances sera abandonné en 2024. L'équipe DevTools travaille à l'intégration de ses fonctionnalités les plus utiles au panneau Performances. Le panneau Insights sur les performances affiche désormais une bannière en haut pour vous informer de l'abandon prochain de cette fonctionnalité.

Pour en savoir plus, consultez Outils d'optimisation des performances à partir de 2024.

Si vous avez des commentaires sur ce qui fonctionne, ce qui ne fonctionne pas et ce que nous pourrions améliorer, n'hésitez pas à nous en faire part.

Coller l'intégralité des chaînes d'en-tête pour les remplacer

Lorsque vous remplacez des en-têtes, vous pouvez désormais coller une chaîne d'en-tête complète (HEADER_NAME: VALUE), et les outils de développement diviseront la chaîne à : en un nom d'en-tête et sa valeur.

Pour voir concrètement comment procéder, regardez la vidéo suivante.

Lorsque vous modifiez des en-têtes, le panneau Réseau vous avertit désormais si vous avez saisi des caractères autres que des caractères alphanumériques, des tirets et des traits de soulignement.

De plus, les options de menu de remplacement et les boutons Modifier sont désactivés pour les URL chrome://, ce qui correspond au comportement prévu.

Problèmes Chromium: 330967147, 337012362, 328210785

Identifier les utilisations excessives de la mémoire à l'aide de nouveaux filtres dans les instantanés de segments de mémoire

Les instantanés de tas du panneau Mémoire bénéficient de nouveaux filtres qui peuvent vous aider à identifier les cas courants d'utilisation inefficace de la mémoire, tels que les chaînes en double, les objets conservés par des nœuds DOM dissociés et la console des outils pour les développeurs.

Problème Chromium: 337094903.

Inspecter les buckets de stockage dans Application > Stockage

Vous pouvez désormais inspecter les buckets de stockage dans une arborescence dédiée dans la section Application > Stockage. Cet arbre, qui était auparavant expérimental, a été activé par défaut.

Problème Chromium: 338094915.

Désactiver les avertissements auto-XSS à l'aide d'une option de ligne de commande

Si vous automatisez l'utilisation de Chrome ou que vous ouvrez les outils pour les développeurs à partir de la ligne de commande pour le débogage, vous devrez souvent désactiver l'avertissement d'auto-XSS qui s'affiche à chaque nouvelle session DevTools.

Vous pouvez désormais désactiver cette boîte de dialogue en transmettant l'indicateur de ligne de commande --unsafely-disable-devtools-self-xss-warnings à Chrome.

Problème Chromium: 41491762.

Lighthouse 12.0.0

Le panneau Lighthouse exécute désormais la version 12.0.0.

Cette mise à jour apporte un certain nombre de modifications, y compris la suppression de catégories PWA, la réorganisation des catégories SEO, l'abandon de la fonctionnalité Économies globales, de nouveaux audits et des modifications apportées aux audits. Consultez la liste complète des modifications.

Pour découvrir les principes de base de l'utilisation du panneau Lighthouse dans DevTools, consultez Lighthouse : optimiser la vitesse de votre site Web.

Problème Chromium: 772558.

Points importants divers

Voici quelques correctifs et améliorations importants dans cette version:

• Performances :
  • Les paramètres de capture lente (Activer l'instrumentation avancée de peinture et Activer les statistiques du sélecteur CSS) sont désormais supprimés automatiquement lors de la prochaine session des outils de développement.
  • L'onglet Statistiques du sélecteur ne défile plus automatiquement vers le bas lorsque vous faites un zoom sur le graphique en forme de flamme et que les données changent (337999939).
• Console : le raccourci Ctrl+` ne ferme désormais la console dans le panneau latéral que si elle est sélectionnée (40875466, 328210785).
• Saisie automatique: l'analyse des adresses est corrigée (335409093, 335409707).
• Accessibilité: les annonces du lecteur d'écran pour les chaînes localisées sont fixes (324930007).

Télécharger les canaux de prévisualisation

Envisagez d'utiliser Chrome Canary, Dev ou Bêta comme navigateur de développement par défaut. Ces versions preview vous permettent d'accéder aux dernières fonctionnalités des outils de développement, de tester des API de plate-forme Web de pointe et de détecter les problèmes sur votre site avant vos utilisateurs.

Contacter l'équipe des outils pour les développeurs Chrome

Utilisez les options suivantes pour discuter des nouvelles fonctionnalités, des mises à jour ou de tout autre élément lié aux outils pour les développeurs.

• Envoyez-nous vos commentaires et vos demandes de fonctionnalités sur crbug.com.
• Signalez un problème dans les outils de développement à l'aide de l'icône more_vert Plus d'options > Aide > Signaler un problème dans les outils de développement dans les outils de développement.
• Envoyez un tweet à @ChromeDevTools.
• Laissez des commentaires sur les vidéos YouTube sur les nouveautés des outils pour les développeurs ou sur les vidéos YouTube sur les conseils concernant les outils pour les développeurs.

Nouveautés des outils pour les développeurs

Liste de tous les éléments abordés dans la série Nouveautés des outils pour les développeurs.