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.

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

Confira a lista completa de alterações no registro de alterações 11.0.

Atualizações da categoria de acessibilidade

As atualizações da categoria incluem novas auditorias automatizadas, ponderação aprimorada 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, os pesos de todas as auditorias foram atualizados para corresponder melhor aos níveis de impacto da regra do eixo. Consulte a documentação Pontuação de acessibilidade do Lighthouse para ver detalhes exatos sobre as novas auditorias e ponderações.

Visibilidade da auditoria manual

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

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

Isso enfatiza que passar em todas as auditorias automatizadas e receber uma nota 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, 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 service-worker foi removida da categoria 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 sinalização --legacy-navigation para a CLI, a função legacyNavigation() na API Node e a "Navegação legada" caixa de seleção no painel DevTools foram removidas. Isso conclui uma transição de anos na infraestrutura do Lighthouse para oferecer suporte aos fluxos de usuário.

Em execução no Lighthouse

O Lighthouse está disponível no Chrome DevTools, no npm (como um módulo Node e uma ferramenta da 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, as mudanças na versão do Lighthouse 11 ou qualquer outro item relacionado a ele: