Suggerimenti e Trucchi per Chrome DevTools

Questa pagina fornisce un cheat sheet di suggerimenti e trucchi per Chrome Developer Tools (DevTools), incluse operazioni di debug, monitoraggio della rete, analisi delle prestazioni e altro ancora.

Pannello Elements (Elementi)

Azione	Scorciatoia
Apri DevTools	F12 o Ctrl + Shift + I
Attiva/disattiva la barra degli strumenti del dispositivo	Ctrl + Shift + M
Aggiorna e svuota la cache	Ctrl + Shift + R
Visualizza il menu contestuale dell’elemento	Tasto destro
Modifica elemento	Invio
Elimina elemento	Canc
Copia elemento	Ctrl + C
Incolla elemento	Ctrl + V
Visualizza le regole CSS dell’elemento	Ctrl + Shift + C

Pannello Console

Azione	Scorciatoia
Apri console	Esc
Svuota console	Ctrl + L
Copia il testo selezionato	Ctrl + C
Incolla testo	Ctrl + V
Visualizza cronologia comandi	Freccia su e Freccia giù
Visualizza informazioni dettagliate dell’oggetto	Ctrl + Shift + C

Pannello Network (Rete)

Azione	Scorciatoia
Avvia/Interrompi la registrazione dell’attività di rete	Ctrl + E
Svuota log di rete	Ctrl + R
Filtra richieste	Ctrl + F
Visualizza informazioni dettagliate della richiesta	Ctrl + Shift + C

Pannello Performance (Prestazioni)

Azione	Scorciatoia
Avvia/Interrompi la registrazione delle prestazioni	Ctrl + E
Esporta le prestazioni registrate	Ctrl + S
Filtra eventi	Ctrl + F

Pannello Memory (Memoria)

Azione	Scorciatoia
Scatta un’istantanea	Ctrl + S
Esporta l’istantanea	Ctrl + Shift + S
Filtra istantanee	Ctrl + F

Pannello Application (Applicazione)

Azione	Scorciatoia
Aggiorna applicazione	Ctrl + R
Svuota memoria	Ctrl + Shift + R
Filtra dati	Ctrl + F

Pannello Security (Sicurezza)

Azione	Scorciatoia
Visualizza certificato	Ctrl + Shift + C
Ricarica la pagina e salta la cache	Ctrl + Shift + R

Varie (Misc)

Azione	Scorciatoia
Apri impostazioni	F1
Cambia tema	Ctrl + Shift + P quindi scrivi theme
Visualizza scorciatoie	Ctrl + Shift + P quindi scrivi shortcuts