LCP (Largest Contentful Paint)
Objetivo: <2.5s. El Starter precarga la imagen del hero, optimiza fonts con font-display: swap y minimiza el CSS crítico inline.
INP (Interaction to Next Paint)
Objetivo: <200ms. El Starter usa Alpine.js (mucho más ligero que React) y carga JS con defer. Cero blocking en interacciones.
CLS (Cumulative Layout Shift)
Objetivo: <0.1. Todas las imágenes tienen width/height definidos. Los embeds (YouTube, Maps) usan aspect-ratio para reservar el espacio.
Medir en producción
Usa PageSpeed Insights, Chrome UX Report o WebPageTest. Mide siempre la URL pública, no localhost (los resultados son distintos).
Real User Monitoring
Para datos reales de usuarios integra web-vitals.js y envía las métricas a tu Analytics. Mucho más valioso que un Lighthouse aislado.