Da Google I/O, ci siamo impegnati a fondo per rendere Lighthouse un fantastico compagno per la creazione di fantastiche app web progressive:
- Ha dato il benvenuto a 50 nuovi contributors al progetto
- 15 uscite distribuite
- Aggiunti circa 20 test di controllo aggiuntivi (circa 50 in totale)
Oggi siamo lieti di annunciare la versione 1.3 di Lighthouse. Lighthouse 1.3 include molte nuove funzionalità, controlli e le solite correzioni di bug. Puoi
installarla da npm (npm i -g lighthouse) o scaricare l'estensione
dal Chrome Web Store.
Quali sono 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 di Chrome sono stati completamente aggiornati, con una presentazione più chiara dei punteggi e una maggiore coerenza nei risultati di controllo. Abbiamo anche aggiunto informazioni di debug utili quando non superi un test e includiamo suggerimenti alle soluzioni alternative consigliate.
Nuove best practice
A oggi, Lighthouse si è concentrato sulle metriche relative alle prestazioni e sulla qualità delle PWA. Tuttavia, un obiettivo generale del progetto è fornire una guida per tutto lo sviluppo web. Sono incluse indicazioni su best practice generali, suggerimenti su prestazioni e accessibilità e assistenza end-to-end per la creazione di app di qualità.
"Do Better Web" è un'iniziativa all'interno del progetto Lighthouse per aiutare gli sviluppatori a fare meglio sul web. In altre parole, aiutateli a modernizzare e ottimizzare le
applicazioni web. Spesso gli sviluppatori web usano pratiche obsolete, anti-pattern o colpiscono
insidie di prestazioni note senza rendersene conto. Ad esempio, è
ampiamente risaputo che le animazioni basate su JS
devono essere eseguite con requestAnimationFrame() anziché
setInterval(). Tuttavia, se lo sviluppatore non è a conoscenza della
nuova API, la sua app web ne risentirà inutilmente.
Lighthouse 1.3 include più di 20 nuove best practice che vanno da suggerimenti per la modernizzazione delle funzionalità CSS e JavaScript a consigli per le prestazioni come: "Riduci il numero di asset che bloccano la visualizzazione", "Utilizza i Listener di eventi passivi per migliorare le prestazioni dello scorrimento".
Continueremo ad aggiungere altri consigli nel tempo. Se hai suggerimenti per le best practice o vuoi aiutarci a scrivere un controllo, invia una segnalazione 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 l'output di un'esecuzione di Lighthouse (o fai clic per caricare il file) e il gioco è fatto. il report HTML Lighthouse "Insta".
Il visualizzatore Lighthouse ti consente anche di condividere i report con altri. Fai clic sull'icona di condivisione per accedere a GitHub. Archiviamo i report come valore segreto nel tuo account per consentirti di eliminare o aggiornare facilmente un report condiviso in un secondo momento. L'uso di GitHub per l'archiviazione dei dati ti offre anche il controllo della versione senza costi.
I report esistenti possono essere ricaricati dal visualizzatore Lighthouse 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 fare brainstorming sulle idee su cosa vorresti vedere in seguito.