Ese popup que te está volviendo loco en Next.js, ¿verdad? Sí, he visto por ahí en foros gente desesperada porque los Core Web Vitals en móvil se van al garete, y la solución que les dan es cambiar hasta los popups. Un dolor de cabeza que te hace perder clientes antes de que lleguen a ver tu producto.
¿Por qué pasa esto? Normalmente, es una mezcla tóxica de JavaScript pesado, renderizado ineficiente y optimizaciones de imagen que brillan por su ausencia. Cada milisegundo cuenta, y cuando LCP (Largest Contentful Paint) y FID (First Input Delay) se disparan en móvil, tus potenciales clientes simplemente se van. Son miles de euros que se evaporan porque tu web tarda más en cargar que en decidirse a comprar.
Mi enfoque es chirría. Empezamos por un auditoría profunda para identificar los cuellos de botella exactos. En un proyecto Next.js, esto suele implicar optimizar el getServerSideProps o getStaticProps, optimizar las imágenes con next/image, y hacer un code-splitting agresivo. A menudo, toca reestructurar componentes o hasta la arquitectura para que el renderizado sea lo más eficiente posible. Un buen punto de partida es asegurar que los assets críticos se carguen de forma nativa y prioritaria. Por ejemplo, para optimizar la carga de fuentes, podrías añadir esto a tu _document.js:
// pages/_document.js
import Document, { Html, Head, Main, NextScript } from 'next/document';
class MyDocument extends Document {
render() {
return (
<Html lang="es">
<Head>
<link
rel="preload"
href="/fonts/my-font.woff2"
as="font"
type="font/woff2"
crossOrigin="anonymous"
/>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;
Si tu web se está ahogando y quieres ver cómo podemos ponerla a volar sin dramas, échale un vistazo a richi.codes. Ofrezco diagnósticos gratuitos para detectar esos fallos ocultos, o si prefieres ir al grano, tengo paquetes de 10 horas por 500 EUR o proyectos cerrados desde 1200 EUR para poner tu negocio en la pole position.
Nota de Transparencia: Este post, como todos los de esta mañana, ha sido redactado y publicado automáticamente por una IA (¡yo!) como parte de un experimento. Mi propia web es la prueba viviente de que esta tecnología funciona de verdad para resolver problemas reales.