Core web vitals visualizer

Siamo orgogliosi di presentare  il Core Web Vitals visualizer.

Oggi abbiamo lanciato il Core Web Vitals visualizer gratuito nel Chrome Web Store. 

Il Core Web Vitals visualizer è un plug-in per Chrome che aiuta gli utenti a monitorare e visualizzare i Core Web Vitals di una pagina. Queste metriche includono Largest Contentful Paint, First Input Delay, Cumulative Layout Shift, First Contentful Paint, Interaction to Next Paint e Time to First Byte. Il plug-in crea un overlay che mostra all'utente quali elementi sono responsabili dell'instabilità visiva e quali eventi causano un ritardo nell'input. Inoltre, il plug-in scompone i Core Web Vitals nei loro componenti di base, permettendo agli utenti di ottenere una comprensione più dettagliata delle prestazioni di una pagina. Il plug-in è disponibile gratuitamente sul Chrome Web Store.

Come specialista di Core Web Vitals trascorro molto tempo a verificare come una pagina reagisce e risponde quando interagisco con essa.  Cosa succede ai Core Web Vitals e come cambiano i Core Web Vitals quando passo all'emulazione mobile o disabilito la cache del browser?

Certo, utilizzo il tracciamento RUM.  Questo mi dice a livello di singola pagina quali metriche superano o non superano i Core Web Vitals.  Ma perché non li superano?  Questo è qualcosa che puoi davvero capire solo quando interagisci con la pagina.

Per risparmiare un bel po' di tempo ho deciso di automatizzare una piccola parte di un processo lungo e creare un plug-in per Chrome che facesse parte del lavoro noioso al posto mio.  Il risultato è il Core Web Vitals visualizer.  Ho deciso di rendere questo plug-in disponibile per tutti.  Quindi vai avanti e provalo sul Chrome Web Store.

Cosa fa il Core Web Vitals  visualizer?

Per prima cosa registra i Core Web Vitals basati sulla tua interazione con la pagina.  Traccia Largest Contentful Paint,  First Input Delay,  Cumulative  Layout Shift,  First Contentful Paint,  Interaction to Next Paint e  Time to First Byte.

Successivamente creerà un overlay che visualizzerà tutte queste metriche. Questo ti dirà quale elemento è il Largest Contentful Paint,  quali elementi  causano instabilità visiva  e, se hai interagito con la pagina, quale evento ha causato il First Input Delay.

Infine, quando clicchi su una qualsiasi delle metriche, il Core Web Vitals visualizer  scomporrà queste metriche nei loro componenti più basilari.

Perché non usare Lighthouse?

Prova il Core Web Vitals Visualizer!

Vai sul Chrome Store e installa il Core Web Vitals visualizer. E magari... se ti piace lascia una recensione. Te ne sarei grato.