Scanverra
Auditoria com reconhecimento de framework

Auditoria de site Next.js

O Scanverra verifica como seu app Next.js renderiza - server, static ou client - e sinaliza os problemas de next/image, Metadata API e hidratação que silenciosamente custam pontos nos seus Core Web Vitals.

O que verificamos para Next.js

Seis verificações específicas para a forma como o App Router realmente renderiza e entrega código.

Estratégia de renderização por rota

Se uma rota é renderizada no servidor, gerada estaticamente, ou entregue como uma casca vazia que se preenche no lado do cliente - e se essa escolha combina com o conteúdo. Uma página de marketing renderizada inteiramente no cliente não dá nada para um rastreador ler na primeira renderização.

Adoção do next/image

Tags <img> brutas no lugar do next/image, e imagens sem width/height (ou fill) - a combinação que causa mudança de layout quando as imagens aparecem em suas dimensões reais.

Cobertura da Metadata API

Título, description, tag canônica e dados de Open Graph por rota, versus uma única exportação de metadata na raiz reutilizada - ou ausente - em todas as páginas.

Divisão entre componentes de cliente e servidor

Diretivas "use client" desnecessárias colocadas muito acima na árvore de componentes, que puxam uma subárvore inteira - e tudo o que ela importa - para o bundle do navegador, quando apenas uma pequena parte interativa precisava disso.

Incompatibilidades de hidratação

Marcação renderizada no servidor que não corresponde ao que o React produz no cliente, frequentemente vinda de Date.now(), Math.random() ou uma API exclusiva do navegador chamada durante a renderização. Isso aparece como erros de console e derruba a pontuação de Boas Práticas.

Cabeçalhos de segurança em nível de resposta

Se HSTS, X-Frame-Options e cabeçalhos semelhantes estão definidos globalmente - o Next.js permite fazer isso uma única vez na função headers() do next.config, em vez de deixar cada rota nos padrões.

How it works

Três passos, da URL a correções específicas para Next.js.

Cole a URL do seu Next.js

Sem acesso ao repositório e sem etapa de build - rastreamos a página real e publicada, da mesma forma que um navegador ou rastreador faria.

Confirmamos os sinais do App Router

Cabeçalhos de resposta como x-powered-by: Next.js, caminhos de assets /_next/static/ e o payload __NEXT_DATA__ nos dizem que estamos diante de um app Next.js antes de a auditoria rodar.

Receba correções específicas para Next.js

Cada problema é escrito considerando o framework que você realmente está usando - orientação sobre next/image e Metadata API, não conselhos genéricos.

FAQ

Frequently asked questions

O Scanverra sabe se estou usando o App Router ou o Pages Router?

Ele detecta que um site roda em Next.js a partir dos cabeçalhos de resposta e dos caminhos de assets do build, depois aplica verificações que funcionam para qualquer um dos dois roteadores - não precisa distinguir os dois para auditar renderização, imagens e metadados.

A auditoria vai pegar uma tag <img> bruta que esqueci de trocar pelo next/image?

Sim. Imagens não otimizadas e imagens sem width/height aparecem como problemas de Core Web Vitals e de boas práticas, da mesma forma que apareceriam em um relatório do Lighthouse.

Consegue me dizer se uma página específica está renderizando inteiramente no cliente?

A auditoria examina o HTML realmente entregue no primeiro carregamento. Uma página com pouco ou nenhum conteúdo antes do JavaScript rodar vai aparecer como um problema de visibilidade de conteúdo e de SEO - o que geralmente é sinal de que ela está renderizando no lado do cliente sem nada renderizado no servidor por baixo.

Verifica minha configuração da Metadata API especificamente?

Verifica o resultado - título, meta description, tag canônica e dados de Open Graph na página renderizada - independentemente de você tê-los gerado com a Metadata API, um componente Head ou tags fixas no código.

Erros de hidratação vão aparecer no meu relatório?

Erros de console fazem parte da pontuação de Boas Práticas, e incompatibilidades de hidratação são uma das formas mais comuns pelas quais eles aparecem em um app Next.js.

Preciso publicar meu site antes de poder auditá-lo?

Sim - o Scanverra faz a varredura de uma URL ao vivo e publicamente acessível. Um endereço localhost ou uma implantação de preview protegida por senha não vai funcionar.

Free - no sign-up required

Veja seus Core Web Vitals do Next.js em menos de um minuto

Renderização, imagens, metadados e hidratação - avaliados e explicados considerando o framework que você realmente publicou.

Run free audit