James Moro
Iniciei minha vida profissional como desenvolvedor web em 2008. Tenho um canal no Youtube onde publico vídeos sobre tecnologia.
Como encontrar estilos CSS não usados com o Chrome Dev Tools
- Publicado em: Css / Sass, SEO, Tutoriais que resolvem, Vídeos
- 564 visualizações
O melhor da tecnologia está no nosso canal no WhatsApp
As ferramentas para desenvolvedores do Google Chrome permitem analisar rapidamente o conteúdo/recursos de uma página da web.
No vídeo abaixo irei mostrar como usar o Chrome DevTools para encontrar códigos CSS não utilizados. A remoção do código não utilizado pode acelerar o carregamento da página e economizar os dados de celular dos usuários móveis.
No teste será mostrado quais recursos foram analisados e quanto código é usado em cada recurso. Clique em uma linha para abrir esse recurso no painel “Sources” e veja um detalhamento linha por linha do código usado e do código não utilizado.
Quaisquer linhas de código não utilizadas terão uma linha vermelha no início.
Com essa técnica demonstrada no vídeo, será possível analisar os arquivos CSS do seu site que se tornam muito grandes as vezes. Geralmente isso acontece quando você constrói novas classes sem excluir as antigas que agora parou de usar, tornando o arquivo CSS muito confuso para que outros desenvolvedores entendam e façam suas contribuições.
Compartilhe
Sobre o autor
