Immagine FCP – First Contentful Paint – Il primo contenuto visivo stampato

First Contentful Paint (FCP) è una delle sei metriche monitorate nella sezione Performance del rapporto Lighthouse. Ogni metrica cattura alcuni aspetti della velocità di caricamento della pagina.

Il faro mostra FCP in pochi secondi:

Cosa misura FCP

FCP misura quanto tempo impiega il browser per eseguire il rendering del primo contenuto DOM dopo che un utente ha navigato sulla tua pagina. Immagini, elementi non bianchi <canvas>e SVG sulla tua pagina sono considerati contenuti DOM; nulla all’interno di un iframe non è incluso.

In che modo Lighthouse determina il tuo punteggio FCP

Il tuo punteggio FCP è un confronto tra il tempo FCP della tua pagina e i tempi FCP per siti Web reali, basato sui dati dell’archivio HTTP . Ad esempio, i siti con prestazioni nel novantanovesimo percentile rendono FCP in circa 1,2 secondi. Se l’FCP del tuo sito web è di 1,2 secondi, il tuo punteggio FCP è 99. Consulta Come vengono determinati i punteggi delle metriche per sapere come vengono impostate le soglie del punteggio di Lighthouse.

Questa tabella mostra come interpretare il tuo punteggio FCP:

Tempo FCP

(in secondi)

Codificazione del colore
0–1,8 Verde (veloce)
1.8–3 Arancio (moderato)
Oltre 3 Rosso (lento)

Consulta il post sul punteggio delle prestazioni di Lighthouse per sapere come viene calcolato il punteggio delle prestazioni complessive della tua pagina.

Come migliorare il tuo punteggio FCP

Un problema particolarmente importante per FCP è il tempo di caricamento dei caratteri. Dai un’occhiata alla sezione Assicurati che il testo rimanga visibile durante il caricamento del webfont per i modi per accelerare il caricamento dei font.

Tracciamento di FCP sui dispositivi di utenti reali

Per informazioni su come misurare quando si verifica effettivamente l’FCP sui dispositivi dei tuoi utenti, consulta la pagina sulle metriche delle prestazioni incentrate sull’utente di Google. La sezione Tracking FP/FCP descrive come accedere a livello di codice ai dati FCP e inviarli a Google Analytics.

Per ulteriori informazioni sulla raccolta delle metriche degli utenti reali, consulta Google Valutazione delle prestazioni di caricamento nella vita reale con navigazione e tempistica delle risorse .

Come migliorare il tuo punteggio di Performance complessivo

A meno che tu non abbia un motivo specifico per concentrarti su una metrica particolare, di solito è meglio concentrarti sul miglioramento del tuo punteggio di Performance complessivo.

Utilizza la sezione Opportunità del rapporto Lighthouse per determinare quali miglioramenti avranno più valore per la tua pagina. Più significativa è l’opportunità, maggiore sarà l’effetto che avrà sul tuo punteggio di Performance. Ad esempio, lo screenshot di Lighthouse di seguito mostra che l’ eliminazione delle risorse che bloccano il rendering produrrà il miglioramento maggiore:

Consulta la pagina di destinazione Audit delle prestazioni per scoprire come affrontare le opportunità identificate nel rapporto Lighthouse.

Fonte / Source: https://web.dev/first-contentful-paint/

pattern-lines

Prova Gratis Hosting corewebvitals Veloce, Ottimizzato, Sicuro

Passa a Bhoost con 30 giorni gratis e migrazione inclusa

Prova gratis 30 giorni
macbook