Auditoría web para Next.js
Scanverra comprueba cómo renderiza tu aplicación Next.js - en servidor, de forma estática o en cliente - y señala los problemas de next/image, la API de metadatos e hidratación que silenciosamente te cuestan puntos de Core Web Vitals.
Qué comprobamos en Next.js
Seis comprobaciones específicas sobre cómo el App Router realmente renderiza y distribuye código.
Estrategia de renderizado por ruta
Si una ruta se renderiza en el servidor, se genera de forma estática o se envía como una carcasa vacía que se rellena en el cliente - y si esa elección encaja con el contenido. Una página de marketing renderizada por completo en el cliente no le da nada que leer a un rastreador en el primer pintado.
Adopción de next/image
Etiquetas <img> sin optimizar en lugar de next/image, e imágenes sin width/height (o fill) - la combinación que provoca cambios de diseño cuando las imágenes aparecen de golpe con sus dimensiones reales.
Cobertura de la API de metadatos
Título, descripción, etiqueta canónica y datos Open Graph por ruta frente a una única exportación raíz de metadatos reutilizada - o ausente - en todas las páginas.
Reparto entre componentes de cliente y servidor
Directivas "use client" innecesarias colocadas en un punto alto del árbol de componentes, que arrastran todo un subárbol - y todo lo que importa - al paquete del navegador cuando solo una pequeña pieza interactiva lo necesitaba.
Discrepancias de hidratación
Marcado renderizado en servidor que no coincide con lo que React produce en el cliente, a menudo por Date.now(), Math.random() o una API exclusiva del navegador invocada durante el renderizado. Estas aparecen como errores de consola y penalizan la puntuación de Buenas prácticas.
Cabeceras de seguridad a nivel de respuesta
Si HSTS, X-Frame-Options y cabeceras similares están configuradas globalmente - Next.js te permite hacerlo una sola vez en la función headers() de next.config en lugar de dejar cada ruta con sus valores predeterminados.
How it works
Tres pasos desde la URL hasta correcciones específicas de Next.js.
Pega tu URL de Next.js
Sin acceso al repositorio y sin paso de build - escaneamos la página en producción del mismo modo que lo haría un navegador o un rastreador.
Confirmamos las señales del App Router
Cabeceras de respuesta como x-powered-by: Next.js, rutas de recursos /_next/static/ y el payload __NEXT_DATA__ nos indican que estamos ante una app Next.js antes de que se ejecute la auditoría.
Obtén correcciones específicas de Next.js
Cada problema se redacta según el framework que realmente estás usando - orientación sobre next/image y la API de metadatos, no consejos genéricos.
Frequently asked questions
¿Scanverra sabe si uso el App Router o el Pages Router?
Detecta que un sitio ejecuta Next.js a partir de las cabeceras de respuesta y las rutas de los recursos de build, y luego aplica comprobaciones que funcionan para cualquiera de los dos routers - no necesita distinguir entre ambos para auditar el renderizado, las imágenes y los metadatos.
¿La auditoría detecta una etiqueta <img> sin optimizar que olvidé cambiar por next/image?
Sí. Las imágenes sin optimizar y las imágenes sin width/height aparecen como problemas de Core Web Vitals y de buenas prácticas, del mismo modo que lo harían en un informe de Lighthouse.
¿Puede decirme si una página concreta se renderiza por completo en el cliente?
La auditoría inspecciona el HTML realmente entregado en la primera carga. Una página con poco o ningún contenido antes de que se ejecute JavaScript aparecerá como un problema de visibilidad de contenido y de SEO - lo cual suele ser señal de que se renderiza en el cliente sin nada renderizado en el servidor debajo.
¿Comprueba específicamente mi configuración de la API de metadatos?
Comprueba el resultado - título, meta descripción, etiqueta canónica y datos Open Graph en la página renderizada - independientemente de si los generaste con la API de metadatos, un componente Head o etiquetas escritas a mano.
¿Los errores de hidratación aparecerán en mi informe?
Los errores de consola forman parte de la puntuación de Buenas prácticas, y las discrepancias de hidratación son una de las formas más habituales en que aparecen en una app Next.js.
¿Necesito desplegar antes de poder auditar mi sitio?
Sí - Scanverra escanea una URL en producción y públicamente accesible. Una dirección localhost o un despliegue de vista previa protegido con contraseña no funcionarán.
Otras auditorías por tecnología
React
Bundle size, hydration, client-rendered content, and SEO gaps in SPAs.
WordPress
Plugin bloat, render-blocking assets, version disclosure, and wp-json exposure.
Webflow
What's fixable inside the Designer vs. what's locked by the platform.
Auditoría web
Todas las comprobaciones, para cualquier stack tecnológico.
Consulta tus Core Web Vitals de Next.js en menos de un minuto
Renderizado, imágenes, metadatos e hidratación - puntuado y explicado según el framework que realmente has desplegado.
Run free audit