Novidades do Lighthouse 11

Adam Raine
Adam Raine
GitHub
Jasmine Yan
Jasmine Yan
GitHub

O Lighthouse é uma ferramenta de auditoria de sites que ajuda os desenvolvedores com oportunidades e diagnósticos para melhorar a experiência do usuário nos sites deles.

O Lighthouse 11 está disponível imediatamente na linha de comando pelo npm, no Chrome Canary e no PageSpeed Insights. Ele entrará no Chrome estável no Chrome 118.

Confira a lista completa de mudanças no registro de mudanças da versão 11.0.

Atualizações da categoria de acessibilidade

As atualizações de categoria incluem novas auditorias automatizadas, maior ponderação e auditorias manuais priorizadas para ajudar os desenvolvedores a tornar os sites mais acessíveis.

Novas auditorias e ponderação

Desde o Lighthouse 10.0, 13 novas auditorias de acessibilidade foram adicionadas:

  • aria-allowed-role
  • aria-dialog-name
  • aria-text
  • html-xml-lang-mismatch
  • image-redundant-alt
  • input-button-name
  • label-content-name-mismatch
  • link-in-text-block
  • select-name
  • skip-link
  • table–duplicate-name
  • table-fake-caption
  • td-has-header

Além das novas auditorias, as ponderações de todas as auditorias foram atualizadas para corresponder melhor aos níveis de impacto das regras do eixo correspondentes. Consulte a documentação de pontuação de acessibilidade do Lighthouse para ver os detalhes exatos sobre as novas auditorias e pesos.

Visibilidade de auditoria manual

O Lighthouse sempre incluiu algumas auditorias manuais que não podem ser testadas automaticamente, mas ainda são incluídas como uma lista de verificação para verificar funcionalidades importantes. A seção de auditoria manual será expandida automaticamente depois que todas as auditorias automatizadas forem aprovadas.

Um relatório do Lighthouse mostrando as auditorias manuais na categoria de acessibilidade expandidas

Isso enfatiza que passar em todas as auditorias automatizadas e receber uma pontuação 100 em acessibilidade não garante que a página auditada seja acessível. O teste manual ainda é importante. As auditorias manuais também foram reordenadas para começar com as verificações mais acessíveis.

Mudanças nas auditorias atuais

Interação com a próxima exibição (INP)

O INP não é mais experimental (link em inglês), então a métrica foi movida de experimental-interaction-to-next-paint para interaction-to-next-paint.

Service workers

Um service worker não é mais necessário para que uma página possa ser instalada como um PWA no Chrome. Por isso, a verificação de service-worker foi removida da categoria de PWA do Lighthouse.

Resumo do recurso

A auditoria resource-summary foi removida do relatório do Lighthouse. As estatísticas de solicitação de rede ainda podem ser compiladas usando a auditoria network-requests oculta:

const {lhr} = await lighthouse('https://example.com');
const networkRequests = lhr.audits['network-requests'].details.items;
const resourceSummary = {};

for (const request of networkRequests) {
  let total = resourceSummary[request.resourceType] || 0;
  total += request.resourceSize;
  resourceSummary[request.resourceType] = total;
}

console.log(resourceSummary);

Navegação legada

A flag --legacy-navigation para a CLI, a função legacyNavigation() na API Node e a caixa de seleção "Navegação legada" no painel do DevTools foram removidas. Isso conclui uma transição de anos na infraestrutura do Lighthouse para oferecer suporte aos fluxos de usuários.

Farol em execução

O Lighthouse está disponível no Chrome DevTools, no NPM (como um módulo do Node e como uma ferramenta de CLI) e como uma extensão do navegador (no Chrome e no Firefox). Ela também é usada em vários serviços do Google, incluindo o PageSpeed Insights.

Para testar a CLI do Node do Lighthouse, use os seguintes comandos:

npm install -g lighthouse
lighthouse https://www.example.com --view

Entre em contato com a equipe do Lighthouse

Para discutir os novos recursos, mudanças na versão do Lighthouse 11 ou qualquer outra coisa relacionada ao Lighthouse: