Nouveautés des outils pour les développeurs, Chrome 138

Sofia Emelianova
Sofia Emelianova
GitHub

Améliorations apportées au panneau "Performances"

Cette version apporte plusieurs améliorations au panneau Performances.

Origines préconnectées dans l'insight "Arborescence des dépendances réseau"

L'insight Performances > Insights > Arbre des dépendances réseau affiche désormais une liste des origines et des candidats de préconnexion utilisés ou non, le cas échéant.

Les hints de préconnexion permettent à votre site d'établir des connexions précoces avec des origines tierces importantes et d'améliorer la vitesse de chargement des pages.

Avant et après l'ajout d'origines et de candidats préconnectés à l'insight "Arborescence des dépendances réseau".

Pour en savoir plus, consultez Établir des préconnexions aux origines requises.

Temps de réponse et de redirection du serveur dans l'insight "Latence des requêtes de documents"

L'insight Performances > Insights > Latence de la requête de document affiche désormais le temps de réponse du serveur et, le cas échéant, le nombre de redirections et le temps de redirection.

Avant et après avoir ajouté les temps de redirection et de réponse du serveur à l'insight "Latence des requêtes de documents".

Redirections dans le récapitulatif des requêtes réseau

Le panneau Performances affiche désormais les URL de redirection dans le résumé des requêtes réseau et dans leurs info-bulles.

État avant et après l'ajout d'URL de redirection dans le récapitulatif et les info-bulles des requêtes réseau.

Problème Chromium : 402353313.

Réduction du bruit dans la trace des performances

Le panneau Performances n'affiche plus les événements de la catégorie compile du moteur JavaScript v8. Auparavant, ces événements généraient beaucoup de surcharge et de bruit inutiles, en particulier l'événement compile code.

Avant et après la suppression des événements "compiler le code" de la trace des performances.

Si vous remarquez que certains événements importants pour vous ne sont plus disponibles, n'hésitez pas à nous faire part de vos commentaires sur crbug.com/414330508.

"Désactiver les échantillons JavaScript" obsolète

L'option Désactiver les exemples JavaScript dans Performances > Paramètres des captures a été abandonnée et supprimée, car elle était rarement utile et peu utilisée.

Avant et après la suppression de l'option "Désactiver les échantillons JavaScript" dans "Paramètres de capture".

Problème Chromium : 414734883.

Paramètre de précision de la géolocalisation dans les capteurs

Le panneau Capteurs vous permet désormais de définir la précision de l'émulation de la géolocalisation. Vous pouvez ainsi tester la gestion de différents niveaux de précision GPS.

Avant et après l'ajout du paramètre "Précision" à l'émulation de la géolocalisation dans le panneau "Capteurs".

Problème Chromium : 40074843.

Améliorations apportées au panneau "Elements"

Cette version apporte plusieurs améliorations au panneau Éléments.

Déboguer plus facilement les valeurs CSS complexes

Pour vous aider à déboguer des valeurs CSS complexes, l'onglet Éléments > Styles affiche désormais une info-bulle lorsque vous pointez dessus :

  • Chaîne de définition complète des variables CSS, afin que vous n'ayez pas à cliquer sur plusieurs liens.
  • Évaluation étape par étape des calculs CSS complexes, afin de pouvoir identifier plus efficacement les bugs et de mieux comprendre comment une valeur est calculée.

L'info-bulle affiche les chaînes de définition sur plusieurs lignes, une pour chaque définition. Vous pouvez développer des calculs complexes et pointer sur des valeurs pour les mettre en surbrillance et remonter la valeur calculée jusqu'à son expression initiale.

Avant et après l'ajout d'une info-bulle avec des chaînes de définition et des calculs complexes extensibles.

Problème Chromium : 396080529.

Compatibilité avec @function dans Éléments > Styles

En prévision de la compatibilité avec @function dans Chrome, l'onglet Éléments > Styles permet désormais d'associer les noms de vos fonctions personnalisées à leurs définitions dans une section dédiée.

État avant et après l'association du nom de votre fonction personnalisée à la section correspondante.

Améliorations apportées au panneau "Network" (Réseau)

Cette version apporte plusieurs améliorations au panneau Network (Réseau).

has-request-header filtre

Le panneau Réseau est désormais compatible avec le filtre has-request-header, qui vous permet de filtrer par nom d'en-tête de requête spécifique.

État avant et après l'ajout du filtre "has-request-header" au panneau "Network" (Réseau).

Problème Chromium : 397481040.

Direct Sockets dans les applications Web isolées

Dans le panneau Network (Réseau), vous pouvez désormais surveiller le trafic des applications Web isolées (AWI) via TCPSocket, UDPSocket (en mode lié) et UDPSocket (en mode connecté).

Pour ce faire, sélectionnez une connexion directscoket à côté des requêtes régulières dans le tableau, puis sélectionnez un message dans l'onglet Messages.

État avant et après l'ajout de la prise en charge des sockets directs dans les IWA au panneau "Network" (Réseau).

Les applications Web isolées (AWI) fournissent un modèle de sécurité à haut niveau de confiance pour les applications Web. Pour en savoir plus, consultez Premiers pas avec les applications Web isolées et l'application de démonstration qui implémente l'API Direct Sockets.

Autres points forts

Voici quelques corrections et améliorations importantes apportées à cette version :

  • Application > Stockage : suppression de l'option Web SQL obsolète (crbug.com/412707590).
  • Éléments :
  • Réseau : suppression de l'en-tête HTTP Referrer-Policy de l'option Copier en tant que récupération, car il s'agit d'un en-tête de réponse permettant de contrôler le comportement du navigateur, et non d'une instruction côté client (crbug.com/413904896).
  • Performances : suppression des avertissements "tâche longue" des threads de travail, car ils ne bloquent pas les threads principaux (crbug.com/40248589).
  • Problèmes Les rapports incluent désormais :
    • Si des ressources soupçonnées de suivre les utilisateurs sont bloquées.
    • Mesures d'atténuation du suivi des rebonds, que les applications accèdent ou non au stockage lors d'une redirection.
  • Accessibilité Les éléments suivants de Éléments > Styles peuvent désormais être sélectionnés au clavier :

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 canaux de prévisualisation vous donnent accès aux dernières fonctionnalités de DevTools, vous permettent de tester les API de plate-forme Web de pointe et vous aident à 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.

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.