Dicas e Truques do Chrome DevTools

Esta página fornece uma folha de dicas e truques para as ferramentas de desenvolvedor do Chrome (DevTools), incluindo operações de depuração, monitoramento de rede, análise de desempenho e muito mais.

Painel Elements (Elementos)

Ação	Atalho
Abrir DevTools	`F12` ou `Ctrl` + `Shift` + `I`
Alternar barra de ferramentas do dispositivo	`Ctrl` + `Shift` + `M`
Atualizar e limpar cache	`Ctrl` + `Shift` + `R`
Ver menu de contexto do elemento	`Botão direito`
Editar elemento	`Enter`
Excluir elemento	`Delete`
Copiar elemento	`Ctrl` + `C`
Colar elemento	`Ctrl` + `V`
Ver regras CSS do elemento	`Ctrl` + `Shift` + `C`

Painel Console

Ação	Atalho
Abrir console	`Esc`
Limpar console	`Ctrl` + `L`
Copiar texto selecionado	`Ctrl` + `C`
Colar texto	`Ctrl` + `V`
Ver histórico de comandos	`Seta para cima` e `Seta para baixo`
Ver informações detalhadas do objeto	`Ctrl` + `Shift` + `C`

Painel Network (Rede)

Ação	Atalho
Iniciar/Parar gravação de atividade de rede	`Ctrl` + `E`
Limpar log de rede	`Ctrl` + `R`
Filtrar requisições	`Ctrl` + `F`
Ver informações detalhadas da requisição	`Ctrl` + `Shift` + `C`

Painel Performance (Desempenho)

Ação	Atalho
Iniciar/Parar gravação de desempenho	`Ctrl` + `E`
Exportar desempenho gravado	`Ctrl` + `S`
Filtrar eventos	`Ctrl` + `F`

Painel Memory (Memória)

Ação	Atalho
Tirar snapshot	`Ctrl` + `S`
Exportar snapshot	`Ctrl` + `Shift` + `S`
Filtrar snapshots	`Ctrl` + `F`

Painel Application (Aplicativo)

Ação	Atalho
Atualizar aplicativo	`Ctrl` + `R`
Limpar armazenamento	`Ctrl` + `Shift` + `R`
Filtrar dados	`Ctrl` + `F`

Painel Security (Segurança)

Ação	Atalho
Ver certificado	`Ctrl` + `Shift` + `C`
Recarregar página e ignorar cache	`Ctrl` + `Shift` + `R`

Diversos (Misc)

Ação	Atalho
Abrir Configurações	`F1`
Alternar tema	`Ctrl` + `Shift` + `P` e depois digite `theme`
Ver atalhos	`Ctrl` + `Shift` + `P` e depois digite `shortcuts`