Antes de que una página termine de cargar por completo, hay un momento concreto en el que el navegador pinta el primer elemento visible en pantalla: podría ser un texto, un color de fondo o un borde. Ese instante es exactamente lo que mide el FCP (First Contentful Paint, «primer pintado de contenido»): el tiempo que tarda un navegador en mostrar el primer elemento del DOM, desde que empieza la carga de la página.
Por qué no es lo mismo que el LCP
El FCP marca el primer indicio visible de que algo está pasando: la pantalla deja de estar completamente en blanco. El LCP (Largest Contentful Paint) marca un momento posterior y más relevante para la experiencia percibida: cuándo se ha cargado el elemento más grande y significativo de la pantalla, normalmente la imagen principal o un bloque de texto extenso. Un FCP rápido sin un LCP igual de rápido puede dar una falsa sensación de velocidad, mostrando algo mínimo mientras el contenido realmente importante sigue cargando.
Por qué sigue siendo una métrica relevante, aunque no forme parte de los Core Web Vitals oficiales
- Marca el fin de la sensación de «pantalla en blanco», uno de los momentos más frustrantes para quien espera que cargue una web.
- Es un indicador temprano y sencillo de detectar problemas graves de rendimiento, antes incluso de mirar métricas más complejas.
- Herramientas como Lighthouse o PageSpeed Insights lo incluyen de forma habitual dentro de su informe de rendimiento general.
Causas habituales de un FCP lento
Recursos que bloquean la renderización, como hojas de estilo o scripts que el navegador debe descargar y procesar antes de pintar nada en pantalla. Un servidor lento en responder a la primera solicitud. O redirecciones innecesarias antes de llegar al contenido final, cada una añadiendo tiempo antes de que aparezca el primer elemento visible.
Cómo mejorarlo en la práctica
Minimizar el CSS y JavaScript que bloquea la carga inicial, cargando solo lo estrictamente necesario para pintar el primer contenido y dejando el resto para después. Optimizar el tiempo de respuesta del servidor, a menudo con un buen hosting o un sistema de caché eficiente. Y reducir al mínimo las redirecciones previas a la página final, cada una de las cuales retrasa este primer momento visible.