Desde o Google I/O, trabalhamos muito para tornar o Lighthouse um ótimo companheiro para criar ótimos Progressive Web Apps:
- Recebeu 50 novos colaboradores no projeto
- Enviou 15 versões
- Foram adicionados cerca de 20 testes de auditoria (total de 50).
Hoje, temos o prazer de anunciar a versão 1.3 do Lighthouse. O Lighthouse 1.3
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.
O que há de novo?
Nova aparência
Se você já usou uma versão anterior do Lighthouse, talvez tenha notado que o logotipo é novo. O relatório em HTML e a extensão do Chrome também foram totalmente atualizados, com uma apresentação mais clara da pontuação e mais consistência nos resultados da auditoria. Também adicionamos informações úteis de depuração quando você falha em um teste e incluímos indicadores para soluções alternativas recomendadas.
Novas práticas recomendadas
Até o momento, o Lighthouse se concentrou nas métricas de performance e na qualidade dos PWAs. No entanto, o objetivo principal do projeto é fornecer um guia para todo o desenvolvimento da Web. Isso inclui orientações sobre práticas recomendadas gerais, dicas de desempenho e acessibilidade e ajuda completa para criar apps de qualidade.
"Do Better Web" é um esforço do projeto Lighthouse para ajudar os desenvolvedores a melhorar
na Web. Em outras palavras, ajude a modernizar e otimizar os aplicativos
da Web. Muitas vezes, os desenvolvedores da Web usam práticas desatualizadas, antipadrões ou encontram
armadilhas de desempenho conhecidas sem perceber. Por exemplo, é
amplamente conhecido que animações baseadas em JS
precisam ser feitas com requestAnimationFrame() em vez de
setInterval(). No entanto, se o desenvolvedor não souber da
API mais recente, o app da Web vai sofrer desnecessariamente.
O Lighthouse 1.3 inclui mais de 20 sugestões de práticas recomendadas, que vão desde dicas para modernizar recursos do CSS e JavaScript até recomendações de performance, como "Reduzir o número de recursos que bloqueiam a renderização" e "Usar listeners de eventos passivos para melhorar o desempenho da rolagem".
Vamos continuar adicionando mais recomendações com o tempo. Se você tiver sugestões de práticas recomendadas ou quiser nos ajudar a escrever uma auditoria, registre um problema no GitHub.
Visualizador de relatórios
Por fim, temos o prazer de anunciar um novo visualizador da Web para resultados do Lighthouse. Acesse googlechrome.github.io/lighthouse/viewer, arraste e solte a saída de uma execução do Lighthouse (ou clique para fazer upload do arquivo) e pronto. Relatório HTML do Lighthouse "Insta".
O Lighthouse Viewer também permite compartilhar relatórios com outras pessoas. Clicar no ícone de compartilhamento faz você fazer login no GitHub. Os relatórios são armazenados como essência secreta na sua conta. Assim, você pode excluir ou atualizar um relatório compartilhado com facilidade mais tarde. Usar o GitHub para armazenamento de dados também significa que você tem controle de versão sem custo financeiro.
Os relatórios existentes podem ser recarregados pelo Lighthouse Viewer adicionando ?gist=GIST_ID
ao URL:
Para conferir todos os detalhes sobre a versão mais recente do Lighthouse, consulte as notas da versão 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.