Chrome DevTools è un insieme di strumenti per sviluppatori web integrati direttamente nel browser Google Chrome. DevTools consente di modificare le pagine all'istante e di diagnosticare rapidamente i problemi, il che ti consente di creare siti web migliori più velocemente.
Inizia
Tutti i modi in cui puoi aprire Chrome DevTools.
Tieniti al corrente sulle ultime modifiche di DevTools.
Una serie di video in pillole per aiutarti a imparare le funzionalità di DevTools.

Comandi e scorciatoie

Svolgere rapidamente le attività.
Apri il menu dei comandi, esegui comandi, apri i file, visualizza altre azioni e altro ancora.
Leggi la documentazione
Un riferimento completo delle scorciatoie da tastiera.
Leggi la documentazione
Visualizza l'aspetto e il comportamento di una pagina web quando JavaScript è disattivato.
Leggi la documentazione
Simula i dispositivi per creare siti web mobile-first.
Trova il testo in tutte le risorse caricate con il riquadro di ricerca.

Pannelli

Scopri la potenza di ogni riquadro DevTools.
Scopri come visualizzare e modificare il DOM di una pagina.
Leggi la documentazione
Scopri come visualizzare e modificare il CSS di una pagina.
Leggi la documentazione
Registra i messaggi ed esegui JavaScript.
Leggi la documentazione
Visualizza e modifica i file, crea snippet, sottoponi a debug JavaScript e configura un'area di lavoro.
Leggi la documentazione
Registra richieste di rete.
Leggi la documentazione
Valutare il rendimento del sito web.
Leggi la documentazione
Individua i problemi di memoria che influiscono sulle prestazioni delle pagine, ad esempio le perdite di memoria e altro ancora.
Leggi la documentazione
Ispeziona, modifica ed esegui il debug delle app web, testa la cache, visualizza lo spazio di archiviazione e altro ancora.
Leggi la documentazione
Registra, riproduci, misura i flussi utente e modifica i relativi passaggi.
Leggi la documentazione
Scopri una raccolta di opzioni che influiscono sul rendering dei contenuti web.
Leggi la documentazione
Ispezionare ed eseguire il debug degli indirizzi salvati.
Individua e risolvi problemi relativi al tuo sito web.
Assicurati che una pagina sia completamente protetta tramite HTTPS.
Ispeziona un Arraybuffer, TypedArray o DataView in JavaScript, oltre a WebAssembly e alla memoria delle app C++ Wasm.
Esegui l'override della stringa dello user agent.
Testa il tuo sito bloccando le richieste di rete.
Visualizza le informazioni ed esegui il debug dei lettori multimediali per ogni scheda del browser.
Ispezionare e modificare le animazioni.
Tieni traccia delle modifiche apportate a HTML, CSS e JavaScript.
Trova e analizza il codice JavaScript e CSS inutilizzato.
Controlla se le mappe di origine vengono caricate correttamente e caricale manualmente.
Identificare potenziali miglioramenti al CSS.
Ottimizza la velocità del sito web con il riquadro Lighthouse.
Ottieni informazioni strategiche sul rendimento del tuo sito web.
Monitora le prestazioni di carico e runtime.
Visualizzare e modificare i file di origine avendo accesso ad altri riquadri.
Emula i sensori del dispositivo.
Visualizza le metriche dell'API WebAudio.
Emula gli autori di autenticazione.

Guida di riferimento alle impostazioni