First Contentful Paint

Il first contentful paint (FCP) è una delle sei metriche monitorate nella sezione Rendimento del report Lighthouse. Ogni metrica acquisisce alcuni aspetti della velocità di caricamento della pagina.

Lighthouse mostra il tempo FCP in secondi:

Uno screenshot del controllo First Contentful Paint di Lighthouse

Che cosa misura il Modulo di confronto dei partner

Il valore FCP misura il tempo necessario al browser per visualizzare il primo elemento di contenuto DOM dopo che un utente accede alla tua pagina. Le immagini, gli elementi <canvas> non bianchi e gli SVG nella pagina sono considerati contenuti DOM; tutto ciò che si trova all'interno di un iframe non è incluso.

In che modo Lighthouse determina il punteggio FCP

Il punteggio FCP è un confronto tra il tempo FCP della tua pagina e i tempi FCP di siti web reali, in base ai dati dell'archivio HTTP. Ad esempio, i siti con un rendimento nel 99° percentile eseguono il rendering dell'FCP in circa 1,2 secondi. Se il FCP del tuo sito web è 1,2 secondi, il tuo punteggio FCP è 99. Consulta la sezione Come vengono determinati i punteggi delle metriche per scoprire come vengono impostate le soglie di punteggio di Lighthouse.

Questa tabella mostra come interpretare il punteggio FCP:

Tempo FCP
(in secondi)
Codifica con colori
0-1,8 Verde (veloce)
1,8-3 Arancione (moderata)
Più di 3 Rosso (lento)

Come migliorare il punteggio FCP

Un problema particolarmente importante per il FCP è il tempo di caricamento dei caratteri. Consulta il post Assicurati che il testo rimanga visibile durante il caricamento dei caratteri web per scoprire come velocizzare il caricamento dei caratteri.

Monitoraggio del tasso di clic finale sui dispositivi di utenti reali

Per scoprire come misurare quando si verifica effettivamente la frequenza di conversione sui dispositivi degli utenti, consulta la pagina Metriche prestazionali focalizzate sugli utenti di Google. La sezione Monitoraggio FP/FCP descrive come accedere a livello di programmazione ai dati FCP e inviarli a Google Analytics.

Per saperne di più sulla raccolta delle metriche relative agli utenti reali, consulta la pagina di Google Valutazione delle prestazioni del caricamento nella realtà con Navigation e Resource Timing.

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 complessivo del rendimento.

Utilizza la sezione Diagnostica del report Lighthouse per determinare quali miglioramenti avranno il maggiore valore per la tua pagina. Maggiore è l'opportunità, maggiore sarà l'effetto sul punteggio di rendimento. Ad esempio, lo screenshot di Lighthouse che segue mostra che l'eliminazione delle risorse che bloccano il rendering produrrà il miglioramento più significativo:

Lighthouse: sezione Diagnostica che mostra una serie di controlli e il relativo impatto
Lighthouse: sezione Diagnostica

Consulta la sezione Controlli del rendimento per scoprire come sfruttare le opportunità identificate nel report Lighthouse.

Risorse