O Lighthouse é uma ferramenta automatizada de código aberto para melhorar a qualidade dos seus apps da Web. É possível instalá-lo como uma extensão do Chrome ou executá-lo como uma ferramenta de linha de comando do Node. Quando você fornece um URL ao Lighthouse, ele executa uma série de testes na página e gera um relatório explicando como a página se saiu e indicando áreas para melhorias.
Hoje temos o prazer de anunciar a
versão 1.5
do Lighthouse, uma versão enorme, com mais de 128 PRs. O Lighthouse 1.5 inclui
vários novos recursos, auditorias e as correções de bugs usuais. Você pode instalá-lo
no npm (npm i -g lighthouse) ou
fazer o download da extensão
na Chrome Web Store.
Novas auditorias
A Auditoria de uso do CSS informa o número de regras de estilo não usadas na página e a economia de custo/tempo com a remoção delas:
A Auditoria de imagens otimizadas informa imagens que não foram otimizadas e o custo/tempo economizado com a otimização delas:
A verificação de imagens responsivas informa imagens que são muito grandes e a possível economia de custo/tempo de dimensioná-las corretamente para o dispositivo em questão:
A Auditoria de descontinuações e intervenções lista os avisos do console do Chrome se a página estiver usando APIs ou recursos descontinuados que tenham intervenções:
Informar mudanças
Como você viu, nos concentramos em deixar o relatório menos confuso visualmente, adicionando dados tabulares, ocultando textos de ajuda desnecessários e adicionando novos recursos para facilitar a navegação pelos dados.
Configurações de emulação
É fácil esquecer quais configurações de limitação e emulação foram usadas em uma execução específica do Lighthouse. Os relatórios do Lighthouse agora incluem as configurações de emulação de execução que foram usadas para criar o relatório. Um pedido de recurso de longa data:
Dados de rastreamento mais úteis
Métricas do Lighthouse, como "Primeira pintura significativa", "Tempo para interação" etc., são
simuladas como medidas de tempo do usuário e injetadas de volta nos dados de rastreamento salvos
com a flag --save-assets.
Se você usar a flag --save-assets, poderá soltar o rastro no DevTools ou
abrir no Visualizador de linha do tempo do DevTools.
Você vai poder conferir suas principais métricas no contexto com o rastreamento completo do
carregamento da página.
Visualizador do Lighthouse
Nos relatórios em HTML, você vai notar um novo botão com opções para exportar o relatório em diferentes formatos. Uma delas é "Abrir no visualizador". Clicar neste botão envia o relatório para o Visualizador on-line, onde você pode compartilhar o relatório com os usuários do GitHub.
Nos bastidores, o leitor recebe sua permissão via OAuth para criar um gist secreto do GitHub e salva o relatório nele. Como o Gist é seu, você mantém o controle total sobre o compartilhamento do relatório e pode excluí-lo a qualquer momento. É possível revogar a permissão do visualizador para criar resumos nas Configurações do GitHub.
Experimento de desempenho
A primeira versão do projeto Performance Experiment foi lançada na versão 1.5.0. Isso permite testar a performance de carregamento da página, testando de forma interativa os efeitos de bloquear ou atrasar recursos no seu caminho crítico durante o desenvolvimento.
Quando o Lighthouse é executado com a flag --interactive, um relatório especial é
gerado, permitindo a seleção interativa de recursos de página caros. O servidor do experimento, em seguida, executa o Lighthouse novamente nessa página com esses recursos bloqueados.
Saiba mais sobre o experimento de performance no Lighthouse.
Nova documentação
Por fim, modernizamos a documentação em developers.google.com/web/tools/lighthouse/ e adicionamos novas referências de auditoria.
Isso é tudo por enquanto.
Para conferir todos os detalhes sobre as novidades do Lighthouse, consulte as notas de lançamento completas no GitHub. Como sempre, entre em contato para relatar bugs, enviar solicitações de recursos ou discutir ideias sobre o que você gostaria de ver em seguida.