← Torna alle funzionalità
Free

Performance pagina

Fornisce un riepilogo performance istantaneo di qualsiasi pagina web.

Il profiling con Lighthouse richiede tempo. Performance pagina dà quel riepilogo istantaneo leggendo dati dal Performance API del browser.

Anteprima dal vivo
example.com
Panoramica delle prestazioni
Punteggio: 87
0.8s
FCP
1.2s
DOM Pronto
2.4s
Caricamento completo
1.5s
TTI
Suddivisione risorse
JS
842 KB
4 file
CSS
128 KB
2 file
Immagini
456 KB
12 file
Font
98 KB
2 file
Statistiche DOM
1,247
Elementi
14
Profondità max
86
Event Listener
1.5 MB
Dimensione totale
Caratteristiche principali

Metriche di timing chiave

FCP, DOMContentLoaded, Full Load e TTI — colorati: verde (veloce), giallo (moderato), rosso (lento).

Breakdown risorse per tipo

Grafico a barre visivo con conteggio e dimensione per JS, CSS, immagini, font e altro.

Statistiche complessità DOM

Totale elementi DOM, profondità massima di annidamento e conteggio event listener.

Punteggio performance

Punteggio 0-100: verde (85+), giallo (50-84), rosso (0-49).

Peso totale pagina

Dimensione combinata di tutte le risorse scaricate in MB con breakdown per categoria.

Nessun caricamento aggiuntivo

Legge dati dal Performance API — già raccolti durante il caricamento normale.

Casi d'uso comuni

Controllo salute rapido

Apri qualsiasi pagina e ottieni il riepilogo performance in meno di un secondo.

Identificare colli di bottiglia

1.2 MB di JavaScript? Il breakdown mostra chiaramente il problema.

Confronto prima/dopo

Misura prima delle ottimizzazioni, poi dopo per verificare l'impatto.

Benchmarking concorrenti

Confronta tempi di caricamento e peso pagina con i concorrenti.

Monitoraggio regressioni

Esegui regolarmente durante lo sviluppo per catturare regressioni.

Come usare
1

Attiva Performance

Apri il dock e clicca l'icona.

2

Rivedi le metriche

Controlla le quattro metriche di timing in alto.

3

Analizza le risorse

Guarda il grafico a barre per capire quale tipo di risorsa pesa di più.

4

Controlla complessità DOM

Se gli elementi superano 1500 o la profondità supera 15, considera di semplificare.

5

Annota e ottimizza

Esegui prima e dopo le ottimizzazioni per misurare il miglioramento.

Pronto a provare?

Installa DevSuite Pro gratuitamente e sblocca più di 64 strumenti per sviluppatori per il tuo browser.

Aggiungi a Chrome Aggiungi a Edge Aggiungi a FireFox