Largest Contentful Paint (LCP)

Largest Contentful Paint (LCP) es la métrica que te permite medir el tiempo de carga del elemento visual más grande de un sitio.

Para medir ahora mismo el LCP de una página, usa el comprobador de Core Web Vitals gratuito.

Considerado uno de los parámetros más significativos de los Core Web Vitals, Largest Contentful Paint (LCP) mide la velocidad de carga percibida o qué tan rápido se carga y es visible para los usuarios el contenido principal de una página web.

¿Qué es Largest Contentful Paint (LCP)?

La métrica Largest Contentful Paint (LCP) reporta el tiempo de renderizado de la imagen o bloque de texto más grande visible dentro del viewport, relativo a cuando la página comenzó a cargarse por primera vez.

Google considera bueno un LCP de 2.5 segundos o menos, medido en el percentil 75 de las cargas de página. Consulta los umbrales de Core Web Vitals.

Tipos de contenido considerados:

Imágenes, incluidas las imágenes dentro de SVG.
Miniaturas de video (imágenes de póster).
Imágenes de fondo con CSS.
Elementos de texto, como párrafos, encabezados y listas.

¿Cómo mejorar Largest Contentful Paint (LCP)?

Largest Contentful Paint (LCP) se ve afectado principalmente por cuatro factores:

Tiempos de respuesta lentos del servidor
JavaScript y CSS que bloquean el renderizado
Tiempos de carga de recursos
Renderizado del lado del cliente

Mira qué retrasó el LCP en tu resultado

La sección Diagnóstico de rendimiento de un resultado de page speed muestra el Elemento de Largest Contentful Paint de esa ejecución, y el Desglose del LCP divide su tiempo en cuatro fases:

Tiempo hasta el primer byte: la respuesta del servidor
Retraso en la carga del recurso: la espera antes de que la imagen del LCP empiece a descargarse
Tiempo de carga del recurso: la descarga en sí
Retraso en el renderizado del elemento: el tiempo entre el final de la descarga y la aparición del elemento

La fase más larga es por donde empezar. Un retraso de carga largo, por ejemplo, suele indicar que la imagen se descubre tarde; puedes probar una precarga con un experimento de page speed antes de desplegarla. La misma sección muestra también Elementos que se desplazaron y Tiempo de CPU por script.

Para recibir una notificación cuando el LCP empeore, crea una alerta sobre Largest Contentful Paint.

Cada panel de un resultado, incluido el desglose del LCP, se explica en Cómo leer un resultado de page speed.