Le projet Fugu API Showcase est un ensemble d'applications qui utilisent des API conçues dans le contexte du projet Fugu. Pour en savoir plus sur Project Fugu, consultez la page de destination Fonctionnalités.

Filtrer par

API utilisées

Analysez le réseau plus en détail avec les outils pour les développeurs Chrome.

Enregistrez et analysez une trace de performances avec les outils de développement.

Surveillez les métriques Core Web Vitals en temps réel dans le panneau "Performances".

Inspecter et résoudre les problèmes liés au cache avec les outils de développement

Gèlez les éléments du DOM pour pouvoir les inspecter avec les outils pour les développeurs.

Découvrez quatre façons uniques de faire des captures d'écran avec les outils de développement.

Découvrez comment remplacer et simuler des réponses réseau avec les outils de développement.

Découvrez comment les outils de développement peuvent améliorer le développement de vos applications Web.

Accélérez la navigation sur le Web avec des chargements spéculatifs et découvrez comment les déboguer.

Découvrez comment créer des couleurs en quelques clics.

Découvrez comment déboguer le cache amélioré et faire en sorte que votre page se charge instantanément.

Découvrez comment déboguer le DOM à l'aide des outils de développement.

Découvrez comment utiliser les outils de développement pour déboguer les extensions Chrome.

Utilisez des extraits pour exécuter le code que vous utilisez fréquemment et des expressions actives pour surveiller les valeurs en temps réel.

Utilisez des points d'arrêt et de journalisation pour effectuer facilement le débogage.

Découvrez comment enregistrer, revoir et déboguer des parcours utilisateur dans le panneau "Enregistreur" des outils de développement.

Utilisez Application > Stockage local et Stockage de session pour déboguer les paires clé-valeur.

Utilisez Workspace pour enregistrer les modifications apportées dans les outils de développement aux fichiers sources locaux.

Utilisez les mappages source dans les outils de développement pour déboguer votre code d'origine au lieu de le déployer.

Découvrez comment les cartes sources peuvent vous aider à déboguer votre code d'origine plutôt que de le déployer.

Identifiez les problèmes CSS liés aux outils de développement à l'aide des volets "Styles" et "Calculés".

Déboguer les progressive web apps avec les outils de développement

Déboguer les API Project Fugu à l'aide d'outils de développement

Simulez des appareils mobiles avec le mode Appareil dans les outils de développement.

Utilisez le panneau "Présentation du CSS" pour identifier les améliorations potentielles du CSS.

Découvrez comment accélérer votre workflow grâce à une navigation plus rapide dans les outils de développement, à l'aide de raccourcis et de paramètres.

Découvrez toutes les manières d'ouvrir les outils pour les développeurs Chrome.

Découvrez comment utiliser les outils pour les développeurs Chrome afin d'identifier et de résoudre les problèmes de texte à faible contraste.

Utilisez le panneau "Enregistreur" et ses extensions pour modifier, déboguer et exporter des enregistrements de flux utilisateur.

Découvrez comment utiliser les outils pour les développeurs Chrome pour inspecter, modifier et déboguer les mises en page CSS Flexbox.

Utilisez les raccourcis fournis par l'API Console Utilities pour accéder rapidement à des éléments récents, interroger des objets, surveiller les événements et les appels de fonction, etc.

Découvrez comment utiliser les outils pour les développeurs Chrome afin d'afficher et de modifier la mise en page sous forme de grille CSS.

Utilisez l'onglet "Animations" pour inspecter et modifier les animations CSS, les transitions, etc.

Obtenez des insights exploitables sur les performances de votre site Web grâce au nouveau panneau "Insights sur les performances".

Utilisez la console pour consigner des variables, des objets et des messages, filtrer et regrouper les messages, et plus encore.

Utilisez l'onglet "Rendu" pour émuler les préférences des utilisateurs et tester le comportement adaptatif de votre site Web à l'utilisateur.

Inspectez et déboguez les requêtes de conteneur CSS à l'aide des outils de développement.