it-swarm-pt.tech

O que é o recurso "Inspecionar elemento" no Google Chrome?

O que é o recurso Inspecionar elemento no Google chrome e como posso me beneficiar disso? Quando na janela Inspecionar elemento, se eu clicar na guia Recurso, ela não será exibida qualquer tempo de carregamento. Como posso usar esse recurso de maneira eficaz?

Eu vejo a seguinte tela quando abro "Inspecionar Elemento" clicando com o botão direito na página e selecionando o item Inspecionar Elemento:

alt text

4
Prashant

Inspect Element é a versão do Chrome do Firebug. Não é tão completo, mas ainda é uma ferramenta muito útil.

Certifique-se de que a guia Resource esteja habilitada - se não estiver, você não terá nenhum tempo de carregamento. Clique no grande botão "Ativar rastreamento de recursos".

Screenshot

7
Dan Walker

Como outros mencionaram, é o WebKit Web Inspector , que permite inspecionar o HTML e outros recursos de uma página e avaliar os tempos de carregamento e outros. Aqui está uma captura de tela de como usá-lo nesta página (do Safari; mesmo inspetor):

WebKit web inspector

4
jtbandes

Inspecionar elemento permite que você inspecione qualquer elemento HTML que esteja mais próximo da área em que você clicou, assim como a extensão do Firefox firebug . Se você quiser ver os tempos, deve habilitar o rastreamento de recursos permanentemente, ele deve Solicitar isso.

2
John T

Load Time Não tenho certeza de qual Chrome versão que todo mundo está usando, 14.0.835.202 Developer Tools tem uma grande variedade de opções para escolher. Uma das mais úteis é inspecionar um elemento e a) edição ao vivo de html ou b ) edição ao vivo de CSS para desenvolvimento web. Depois de fazer tudo funcionar, você pode editar a coisa real e não ter que fazer a dança edit-flush-reload para ver as mudanças de layout.

Esta é a seção Rede que mostra os tempos de carregamento do elemento da página (como YSlow no Firebug).

Ele provou ser muito mais rápido e melhor configurado para meu uso do que o Firebug no Firefox.

1
Fiasco Labs