KakapoWP KakapoWP
Accedi Prova gratis
Kakapo Performance

CSS critico

Ciò che serve alla parte alta della pagina sta nell'head. Il resto arriva dopo.

Per ogni template il kakapo preleva una vera pagina di esempio del tuo sito web, legge dal disco i fogli di stile locali lì collegati e verifica ogni regola rispetto al documento. Ciò che serve in alto finisce inline nell'head; i fogli di stile analizzati si caricano dopo, senza bloccare il rendering. Non è coinvolto alcun browser: «visibile in alto» è un'approssimazione dichiarata basata sull'ordine degli elementi e, nel dubbio, la regola viene inclusa. Per questo ci sono anteprima, modalità di prova e un interruttore per template.

CSS critico

7 template · per ogni template un'esecuzione, un interruttore e un'anteprima dedicati

Modalità di provaAnteprima

Cosa offre il CSS critico

7 template, ognuno analizzato e approvato singolarmente
CSS critico inline nell'head, i fogli di stile analizzati caricati in ritardo
Report: regole che non hanno colpito alcun elemento
Anteprima della stessa pagina con e senza trattamento
Modalità di prova: solo gli amministratori che hanno effettuato l'accesso vedono la modifica
Lista di esclusione per gli URL, lista di eccezioni per i fogli di stile

Ecco come funziona

1

Analizzare il template — recuperare una pagina di esempio, verificare le regole

2

Confrontare l'anteprima con e senza trattamento

3

Approvare il template, poi passare dalla modalità di prova all'attivo

Domande frequenti sul CSS critico

Viene misurato ciò che è davvero visibile in alto?
No. Non c'è né browser né viewport. Tutti gli elementi sotto body vengono numerati; come «in alto» vale il primo 30 % (regolabile tra 5 e 90) più tutto ciò che sta dentro i punti di riferimento registrati — area di testa, navigazione, primo h1 e ciò che aggiungi tu. Dove il procedimento incontra un limite, la regola vale come trovata: qualche kilobyte di troppo è più innocuo di una regola mancante.
Posso far rimuovere da qui le regole inutilizzate?
L'elenco è un rapporto, non uno strumento. Il conteggio avviene su una pagina di esempio per template — le classi che JavaScript imposta solo al clic, o un modulo su un'altra pagina, lì non compaiono. Conviene cancellare nel codice sorgente del theme, dove resta tracciabile.
Cosa serve all'analisi e cosa succede dopo?
L'estensione PHP dom/libxml e un loopback funzionante — il sito web deve raggiungere sé stesso via HTTP. Se manca uno dei due, l'analisi non si può nemmeno avviare; il motivo è indicato lì stesso. Se in seguito cambia un file CSS analizzato o il theme, il trattamento si sospende invece di consegnare un CSS critico potenzialmente sbagliato.

Altre funzioni di performance

Pronto?

Prova Performance gratis per 24 ore.

Niente carta di credito, nessun rischio. Sei pronto in 2 minuti.

Provalo subito gratis