Da Google I/O, ci siamo impegnati a rendere Lighthouse un fantastico compagno per la creazione di ottime app web progressive:
- Abbiamo accolto 50 nuovi collaboratori nel progetto
- Sono state spedite 15 release
- Sono stati aggiunti circa 20 test di controllo aggiuntivi (~50 in totale)
Oggi siamo lieti di annunciare la versione 1.3 di Lighthouse. Lighthouse 1.3 include una serie di nuove funzionalità importanti, controlli e le solite correzioni di bug. Puoi installarlo da npm (npm i -g lighthouse
) o scaricare l'estensione dal Chrome Web Store.
Quali sono quindi le novità?
Nuovo design
Se hai utilizzato una versione precedente di Lighthouse, potresti aver notato che il logo è nuovo. Anche il report HTML e l'estensione per Chrome sono stati sottoposti a un aggiornamento completo, con una presentazione più chiara del punteggio e una maggiore coerenza tra i risultati degli audit. Abbiamo anche aggiunto informazioni utili per il debug quando un test non va a buon fine e includiamo indicazioni per le soluzioni alternative consigliate.

Nuove best practice
Finora, Lighthouse si è concentrato sulle metriche sul rendimento e sulla qualità delle PWA. Tuttavia, uno scopo generale del progetto è fornire una guida per tutto lo sviluppo web. Sono incluse indicazioni sulle best practice generali, suggerimenti sul rendimento e sull'accessibilità e assistenza end-to-end per creare app di qualità.
"Fai un web migliore" è un progetto del progetto Lighthouse volto ad aiutare gli sviluppatori a migliorare sul web. In altre parole, aiutali a modernizzare e ottimizzare le loro applicazioni web. Spesso, gli sviluppatori web utilizzano pratiche obsolete, antipattern o si imbattono in noti problemi di prestazioni senza rendersene conto. Ad esempio, è noto che le animazioni basate su JS devono essere realizzate con requestAnimationFrame()
anziché con setInterval()
. Tuttavia, se lo sviluppatore non è a conoscenza dell'API più recente, la sua app web ne risente inutilmente.
Lighthouse 1.3 include oltre 20 suggerimenti per le nuove best practice, che vanno da suggerimenti per il riammodernamento delle funzionalità CSS e JavaScript a consigli per le prestazioni, come "Riduci il numero di asset che bloccano il rendering" e "Utilizza event listener passivi per migliorare le prestazioni di scorrimento".

Continueremo ad aggiungere altri consigli nel tempo. Se hai suggerimenti per le best practice o vuoi aiutarci a scrivere un audit, segnala un problema su GitHub.
Visualizzatore rapporti
Infine, siamo lieti di annunciare un nuovo visualizzatore web per i risultati di Lighthouse. Visita la pagina googlechrome.github.io/lighthouse/viewer, trascina il risultato di un'esecuzione di Lighthouse (o fai clic per caricare il file) e il gioco è fatto. Report HTML Lighthouse "Insta".

Lighthouse Viewer ti consente anche di condividere i report con altri utenti. Se fai clic sull'icona di condivisione, accedi a GitHub. Archiviamo i report come gist segreto nel tuo account in modo che tu possa eliminare facilmente un report condiviso o aggiornarlo in un secondo momento. Se utilizzi GitHub per lo stoccaggio dei dati, hai a disposizione anche il controllo della versione senza costi aggiuntivi.

I report esistenti possono essere ricaricati da Lighthouse Viewer aggiungendo ?gist=GIST_ID
all'URL:

Per tutti i dettagli sulle ultime novità di Lighthouse, consulta le note di rilascio complete su GitHub. Come sempre, contattaci per segnalare bug, inviare richieste di funzionalità o condividere idee su cosa vorresti vedere in futuro.