First Meaningful Paint (FMP) è una delle sei metriche monitorate nella sezione Rendimento del report Lighthouse. Ogni metrica acquisisce un aspetto della velocità di caricamento della pagina.
Lighthouse mostra FMP in secondi:
Cosa misura FMP
La metrica FMP indica quando diventano visibili i contenuti principali di una pagina per l'utente. Il punteggio grezzo per FMP è il tempo in secondi tra l'inizio del caricamento della pagina da parte dell'utente e il rendering dei contenuti principali above the fold della pagina. FMP mostra essenzialmente la tempistica della visualizzazione dopo la quale si verifica la maggiore variazione del layout above the fold. Scopri di più sui dettagli tecnici di FMP in Time to First Meaningful Paint: a layout-based approach di Google.
First Contentful Paint (FCP) e FMP sono spesso uguali quando il primo bit di contenuti visualizzato nella pagina include i contenuti above the fold. Tuttavia, queste metriche possono differire quando, ad esempio, sono presenti contenuti above the fold all'interno di un iframe. FMP viene registrato quando i contenuti all'interno dell'iframe sono visibili all'utente, mentre FCP non include i contenuti dell'iframe.
Come Lighthouse determina il punteggio FMP
Come FCP, FMP si basa su dati reali sulle prestazioni dei siti web provenienti da HTTP Archive.
Quando FMP e FCP sono uguali, i loro punteggi sono identici. Se FMP si verifica dopo FCP, ad esempio quando una pagina contiene contenuti iframe, il punteggio FMP sarà inferiore a quello FCP.
Ad esempio, supponiamo che il tuo FCP sia di 1,5 secondi e il tuo FMP sia di 3 secondi. Il punteggio FCP sarebbe 99, mentre il punteggio FMP sarebbe 75.
Questa tabella mostra come interpretare il punteggio FMP:
| Metrica FMP (in secondi) |
Codifica con colori | Punteggio FMP (percentile dell'archivio HTTP FCP) |
|---|---|---|
| 0-2 | Verde (veloce) | 75-100 |
| 2-4 | Arancione (moderato) | 50-74 |
| Più di 4 | Rosso (lento) | 0-49 |
Come migliorare il punteggio FMP
Consulta Come migliorare Largest Contentful Paint sul tuo sito. Le strategie per migliorare FMP sono in gran parte le stesse di quelle per migliorare Largest Contentful Paint.
Monitoraggio di FMP sui dispositivi degli utenti reali
Per scoprire come misurare quando si verifica effettivamente FMP sui dispositivi degli utenti, consulta la pagina Metriche prestazionali incentrate sull'utente di Google. La sezione Monitoraggio di FMP utilizzando gli elementi hero descrive come accedere a livello di programmazione ai dati FCP e inviarli a Google Analytics.
Consulta l'articolo di Google Valutazione delle prestazioni di caricamento nella realtà con Navigation e Resource Timing per saperne di più sulla raccolta delle metriche utente reali. Il controllo di Lighthouse su indicatori e misurazioni dei tempi utente ti consente di visualizzare i dati sui tempi utente nel report.
Come migliorare il punteggio di rendimento complessivo
A meno che tu non abbia un motivo specifico per concentrarti su una determinata metrica, in genere è meglio concentrarsi sul miglioramento del punteggio di rendimento complessivo.
Utilizza la sezione Diagnostica del report Lighthouse per determinare quali miglioramenti avranno il maggior valore per la tua pagina. Più significativa è l'opportunità, maggiore sarà l'effetto sul punteggio di rendimento. Ad esempio, lo screenshot di Lighthouse seguente mostra che l'eliminazione delle risorse di blocco del rendering produrrà il miglioramento più significativo:
Consulta gli audit delle prestazioni per scoprire come sfruttare le opportunità identificate nel report Lighthouse.