Présentation de l'onglet "Rendu"

Sofia Emelianova
Sofia Emelianova

Découvrez une collection d'options qui affectent le rendu du contenu Web avec cette présentation des fonctionnalités de l'onglet Rendering (Affichage) dans DevTools.

Présentation

L'onglet Affichage vous permet de:

  • Détectez les problèmes de performances de rendu. Détectez les retouches, les décalages de mise en page, les calques et les tuiles, les problèmes de défilement, consultez les statistiques de rendu et les Core Web Vitals.
  • Émulez les fonctionnalités multimédias CSS. Testez l'affichage des pages avec différentes fonctionnalités multimédias CSS sans les spécifier manuellement dans votre code ou votre environnement de test.
  • Appliquer d'autres effets utiles Mettre en surbrillance les cadres d'annonces, émuler la sélection d'un élément sur une page, désactiver les polices et les formats d'image locaux, activer un thème sombre automatique et émuler des déficiences visuelles

Ouvrez l'onglet "Rendu".

Pour ouvrir l'onglet Rendu:

  1. Accédez aux outils de développement.

  2. Appuyez sur Commande+Maj+P (Mac) ou sur Contrôle+Maj+P (Windows, Linux, ChromeOS) pour ouvrir le menu de commande.

    Menu de commandes, "Rendering" (Affichage)

  3. Commencez à saisir rendering, sélectionnez Afficher le rendu, puis appuyez sur Entrée. DevTools affiche l'onglet Rendering (Rendu) en bas de la fenêtre.

Vous pouvez également ouvrir l'onglet Rendering (Affichage) de différentes manières:

  • Appuyez sur Esc pour ouvrir le panneau latéral, puis en haut à gauche, cliquez sur Plus d'outils Plus > Rendu.
  • En haut à droite, cliquez sur Autres options Plus > Plus d'outils > Rendu.