La primera pintura significativa (FMP) es una de las seis métricas de las que se hace un seguimiento en la sección Rendimiento del informe de Lighthouse. Cada métrica abarca algún aspecto de la velocidad de carga de la página.
Lighthouse muestra FMP en segundos:
Qué mide el FMP
La FMP mide cuándo el usuario puede ver el contenido principal de una página, La puntuación sin procesar de FMP es el tiempo en segundos entre que el usuario inicia la carga de la página y la página que renderiza el contenido de la mitad superior de la página principal. En esencia, FMP muestra el momento en que se realiza la pintura y, luego, se produce el mayor cambio de diseño de la mitad superior de la página. Obtén más información sobre los detalles técnicos de FMP en Tiempo para la primera pintura significativa: un enfoque basado en el diseño de Google.
La primera pintura con contenido (FCP) y la FMP suelen ser las mismas cuando la primera parte del contenido que se renderiza en la página incluye el contenido en la parte superior de la página. Sin embargo, estas métricas pueden diferir cuando, por ejemplo, hay contenido en la mitad superior de la página dentro de un iframe. El FMP se registra cuando el usuario puede ver el contenido dentro del iframe, mientras que el FCP no incluye el contenido del iframe.
Cómo Lighthouse determina tu puntuación de FMP
Al igual que el FCP, el FMP se basa en datos de rendimiento de sitios web reales provenientes del archivo HTTP.
Cuando FMP y FCP son iguales, sus puntuaciones son idénticas. Si el FMP se produce después de la FCP, por ejemplo, cuando una página incluye contenido de iframe, la puntuación de FMP será menor que la de FCP.
Por ejemplo, supongamos que tu FCP es de 1.5 segundos y tu FMP es de 3 segundos. La puntuación FCP sería 99, pero la puntuación FMP sería 75.
En esta tabla, se muestra cómo interpretar tu puntuación de FMP:
| Métrica FMP (en segundos) |
Códigos de color | Puntuación de FMP (percentil de archivo HTTP de FCP) |
|---|---|---|
| De 0 a 2 | Verde (rápido) | De 75 a 100 |
| De 2 a 4 | Naranja (moderado) | De 50 a 74 |
| Más de 4 | Rojo (lento) | 0 a 49 |
Cómo mejorar tu puntuación de FMP
Consulta Cómo mejorar Largest Contentful Paint en tu sitio. Las estrategias para mejorar FMP son, en gran medida, las mismas que las estrategias para mejorar Largest Contentful Paint.
Seguimiento de FMP en dispositivos de usuarios reales
Para obtener información sobre cómo medir cuándo se produce una FMP en los dispositivos de los usuarios, consulta la página Métricas de rendimiento centradas en usuarios de Google. En la sección Cómo hacer un seguimiento de FMP con elementos hero, se describe cómo acceder a los datos de FCP de manera programática y enviarlos a Google Analytics.
Consulta el artículo de Google Cómo evaluar el rendimiento de carga en la vida real con Navigation y Resource Timing para obtener más información sobre la recopilación de métricas de usuarios reales. Las marcas y mediciones de User Timing de la auditoría de Lighthouse te permiten ver los datos de User Timing en tu informe.
Cómo mejorar tu nivel de rendimiento general
A menos que tengas un motivo específico para enfocarte en una métrica en particular, por lo general, es mejor enfocarse en mejorar tu puntuación de rendimiento general.
Usa la sección Oportunidades del informe de Lighthouse para determinar qué mejoras tendrán el mayor valor para tu página. Cuanto más significativa sea la oportunidad, mayor será el efecto que tendrá en tu puntuación de rendimiento. Por ejemplo, la captura de pantalla de Lighthouse que aparece a continuación muestra que eliminar los recursos de bloqueo de renderización producirá la mayor mejora:
Consulta la página de destino de las auditorías de rendimiento para obtener información sobre cómo abordar las oportunidades identificadas en tu informe de Lighthouse.