Réorganisez les onglets des outils de développement selon la méthode qui vous convient le mieux. Vérifiez exactement à quel niveau les événements du framework ont été liés et bloquez les requêtes réseau pour voir quels scripts tiers vous ralentissent.
Meilleure navigation dans les panneaux: console n° 2, réorganisation des onglets et traits de soulignement pratiques
Après avoir examiné les sections des outils de développement les plus utilisées, il est devenu évident que le panneau plein écran de la console ne méritait pas la dernière position dans la barre d'onglets principale. Deuxième panneau le plus utilisé, il s'agit désormais du deuxième onglet. Cela est particulièrement important pour les résolutions inférieures, lorsque nous ne pouvons pas afficher tous les onglets en même temps.
Mais regardez, nous comprenons. L'ordre classique fait partie de votre mémoire musculaire et vous aurez peut-être la sensation d'étourdissement pendant un certain temps. Ou peut-être, halètement, vous détestez simplement la console plein écran ! Pas d'inquiétude, nous avons ce qu'il vous faut. Vous pouvez désormais réorganiser les onglets en les faisant glisser, comme suit:
Les modifications apportées à la barre d'onglets sont conservées. Elles fonctionnent à la fois avec les onglets natifs et ceux fournis par les extensions. En bonus, nous avons ajouté des traits de soulignement animés pour vous aider. Parce qu'on est sympa comme ça.
Compatibilité avec les écouteurs d'événements de framework
Les événements créés par des frameworks JS tels que jQuery ont parfois été contraignants pour travailler avec les outils de développement. En effet, la plupart des frameworks encapsulent les événements DOM natifs dans leur API d'événements personnalisés. L'analyse de l'écouteur d'événements ne révèle donc pas grand-chose sur ce qui se passe:
Toutefois, grâce à la nouvelle option "Écouteurs de framework" dans l'onglet "Écouteur d'événements", les outils de développement prennent connaissance de la partie d'encapsulation du framework et la résolve automatiquement. Désormais, les événements liés par des frameworks se comportent exactement comme leurs homologues natifs et vous indiquent où ils étaient réellement liés:
Le meilleur du reste
- Les outils de mise en forme personnalisés permettent aux langages transcompilés tels que CoffeeScript, de mieux formater leurs objets dans la console DevTools.
La timeline dispose d'une nouvelle boîte de dialogue plus esthétique lors de l'enregistrement, qui vous montre d'un coup d'œil l'état, l'heure et l'utilisation de la mémoire tampon.
Sur le même plan, le panneau "Network" (Réseau) affiche une astuce utile lorsqu'il est vide:
Vous pouvez désormais filtrer le contenu mixte dans le panneau "Network" en utilisant l'entrée de filtre et en la définissant sur
mixed-content:displayed
Comme toujours, n'hésitez pas à nous donner votre avis via Twitter ou les commentaires ci-dessous, et signalez vos bugs à l'adresse crbug.com/new.
Jusqu'au mois prochain ! Paul Bakaus et l'équipe des outils de développement