O Lighthouse é uma ferramenta automatizada de código aberto que melhora a qualidade dos seus apps da Web. Você pode instalá-lo como uma extensão do Chrome ou executá-la 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 o desempenho da página e indicando áreas de melhoria.
Hoje, temos o prazer de anunciar o
lançamento 1.5
do Lighthouse, um grande lançamento, com mais de 128 PRs. O Lighthouse 1.5 inclui
vários recursos novos e importantes, auditorias e as correções de bugs habituais. Ela pode ser instalada
a partir do npm (npm i -g lighthouse) ou
faça 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 utilizadas na sua página e a economia de tempo/custo ao removê-las:
A auditoria de imagens otimizadas registra imagens não otimizadas e a economia de custo/tempo com essa otimização:
A Auditoria de imagens responsivas informa imagens que são muito grandes e a possível economia de custo/tempo do dimensionamento correto para o dispositivo especificado:
A Auditoria de descontinuações e intervenções lista os avisos do console do Chrome se a página usar APIs ou recursos descontinuados que tenham intervenções:
Informar mudanças
Como você viu, nosso foco foi tornar o relatório menos confuso adicionando dados tabulares, ocultando texto de ajuda irrelevante 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 tempo de execução que foram usadas para criar o relatório, uma solicitação de recurso de longo tempo:
Dados de trace mais úteis
As métricas do Lighthouse, como "Primeira exibição significativa", "Tempo para interação" etc., são
simuladas como a velocidade do usuário mede e injetadas de volta nos dados de trace salvos
com a sinalização --save-assets.
Se você usar a flag --save-assets, agora poderá soltar o rastro no DevTools ou
abri-lo no Visualizador de linha do tempo do DevTools.
Você poderá ver suas principais métricas em contexto com o trace completo do
carregamento de página.
Leitor do Lighthouse
Nos relatórios HTML, você vai notar um novo botão com opções para exportar o relatório em diferentes formatos. Uma dessas opções é "Abrir no visualizador". Ao clicar nesse botão, o relatório é enviado para o Leitor on-line, onde é possível compartilhá-lo com os usuários do GitHub.
Em segundo plano, o Leitor recebe sua permissão via OAuth para criar um gist secret do GitHub e salva o relatório lá. Como isso é feito como seu Gist, você mantém controle total sobre o compartilhamento do relatório e pode excluí-lo a qualquer momento. É possível revogar a permissão de Leitor para criar grupos nas configurações do GitHub.
Experimento de performance
A primeira versão do projeto Experimento de desempenho está na versão 1.5.0. Com isso, é possível testar o desempenho do carregamento da página e testar interativamente os efeitos do bloqueio ou atraso de recursos no seu caminho crítico durante o desenvolvimento.
Quando o Lighthouse é executado com a sinalização --interactive, é gerado um relatório especial que permite a seleção interativa de recursos de página caros. Em seguida, o
servidor do experimento executa o Lighthouse novamente nessa página com esses recursos
bloqueados.
Saiba mais sobre o experimento de desempenho no Lighthouse.
Nova documentação
Por último, mas não menos importante, modernizamos a documentação em developers.google.com/web/tools/lighthouse/ e adicionamos novas referências de auditoria.
Por enquanto, é isso.
Para saber tudo sobre as novidades do Lighthouse, consulte as notas da versão completas no GitHub. Como sempre, entre em contato para informar bugs, enviar solicitações de recursos ou discutir ideias sobre o que você gostaria de ver a seguir.