Utilisez l'onglet "Conditions de la requête" pour bloquer des URL spécifiques ou appliquer des profils de limitation de bande passante réseau personnalisés à des ressources individuelles.
Présentation
Auparavant, les outils pour les développeurs Chrome vous permettaient de limiter les conditions réseau de manière globale pour l'ensemble de la session (en affectant toutes les requêtes) ou de bloquer complètement des requêtes spécifiques. Toutefois, il était difficile de tester la façon dont votre application gère les ressources lentes spécifiques, comme une API tierce qui a du mal à gérer la latence ou une grande image de bannière qui se charge sur une connexion lente, sans ralentir l'ensemble de la page.
À partir de Chrome 144, les outils de développement sont désormais compatibles avec la limitation individuelle des requêtes. Vous pouvez sélectionner des requêtes réseau individuelles pour leur appliquer des conditions réseau spécifiques, en plus de la possibilité de les bloquer. Cette fonctionnalité déplace les fonctionnalités qui se trouvaient auparavant dans le tiroir "Blocage des requêtes réseau" vers un nouveau tiroir Conditions de requête plus complet. Cette fonctionnalité est plus précise et permet de déboguer plus rapidement, en ralentissant uniquement les ressources demandées et non l'ensemble du site.
Limiter ou bloquer une requête
Pour bloquer ou limiter une ressource spécifique, effectuez un clic droit sur une requête dans le panneau Réseau, puis sélectionnez Bloquer la requête ou Limiter la requête pour l'URL exacte ou le domaine entier. Cette action ouvre automatiquement le panneau Conditions requises, crée une règle pour l'entrée et applique immédiatement les contraintes réseau sélectionnées.
Panneau des conditions de la requête
Dans le nouveau panneau Conditions de la requête, vous pouvez contrôler les requêtes concernées et le degré de ralentissement.
Vous pouvez personnaliser les paramètres de limitation en sélectionnant des préréglages standards (comme "3G lente") ou vos propres profils personnalisés. Vous pouvez également modifier les modèles d'URL à l'aide de caractères génériques (*) pour appliquer ces conditions à des ressources dynamiques spécifiques ou à des groupes de requêtes.
Si une requête correspond à plusieurs modèles, les outils de développement appliquent la première règle trouvée. Vous pouvez contrôler cette priorité à l'aide des flèches du tiroir pour déplacer les règles de priorité élevée en haut de la liste.
Comprendre quelles requêtes sont limitées ou bloquées
Il est essentiel de faire la distinction entre les requêtes naturellement lentes et celles qui sont artificiellement limitées par les outils de développement. Lorsque vous actualisez la page, les nouvelles règles de limitation sont appliquées. Vous pouvez facilement identifier les requêtes concernées dans le panneau "Réseau" :
- Les requêtes bloquées sont affichées en rouge et l'état
(blocked:devtools)est indiqué dans la colonne "État". - Les requêtes limitées s'affichent en jaune ou en or, et sont associées à une icône d'horloge dans la colonne "Heure". Vous pouvez pointer sur l'icône pour voir exactement quelle condition de réseau est appliquée. Cette information est également visible dans le sous-panneau "Timing".
La limitation des requêtes peut avoir une incidence sur les performances de la page. Lorsque vous enregistrez un profil de performances, vous pouvez pointer sur la requête dans la piste "Réseau" pour afficher une info-bulle détaillant les conditions réseau appliquées.
