Update Lighthouse Januari 2017

Lighthouse adalah alat open source otomatis untuk meningkatkan kualitas aplikasi web Anda. Anda dapat menginstalnya sebagai Ekstensi Chrome atau menjalankannya sebagai alat command line Node. Saat Anda memberi URL, Lighthouse akan menjalankan serangkaian pengujian terhadap halaman, lalu menghasilkan laporan yang menjelaskan performa halaman yang baik dan menunjukkan area yang perlu ditingkatkan.

Logo Lighthouse
Logo Lighthouse

Hari ini, dengan senang hati kami mengumumkan rilis 1.5 Lighthouse, rilis besar, dengan lebih dari 128 PR. Lighthouse 1.5 menyertakan banyak fitur baru yang hebat, audit, dan perbaikan bug biasa. Anda dapat menginstalnya dari npm (npm i -g lighthouse) atau mendownload ekstensi ini dari Chrome Web Store.

Audit Baru

Audit Penggunaan CSS melaporkan jumlah aturan gaya yang tidak digunakan di halaman Anda dan penghematan biaya/waktu jika menghapusnya:

Audit Penggunaan CSS

Audit Gambar yang Dioptimalkan melaporkan gambar yang tidak dioptimalkan dan penghematan biaya/waktu pengoptimalannya:

AudiT Gambar yang Dioptimalkan

Audit Gambar Responsif melaporkan gambar yang terlalu besar dan potensi penghematan biaya/waktu jika ukurannya tepat di perangkat tertentu:

AudiT Gambar yang Dioptimalkan

Audit Penghentian dan Intervensi mencantumkan peringatan konsol dari Chrome jika halaman Anda menggunakan API atau fitur yang tidak digunakan lagi dan memiliki intervensi:

Audit Penghentian dan Intervensi

Laporkan perubahan

Seperti yang Anda lihat, kita telah berfokus untuk membuat laporan menjadi lebih rapi secara visual dengan menambahkan data tabel, menyembunyikan teks bantuan yang tidak relevan, dan menambahkan fitur baru untuk memudahkan navigasi data.

Setelan emulasi

Sangat mudah untuk melupakan setelan throttling dan emulasi yang digunakan untuk proses Lighthouse tertentu. Laporan Lighthouse kini menyertakan setelan emulasi runtime yang digunakan untuk membuat laporan; permintaan fitur lama:

Setelan emulasi

Data rekaman aktivitas yang lebih bermanfaat

Metrik Lighthouse seperti "First bermakna paint", "Time to Interactive", dll. ditiru sebagai tindakan Waktu Pengguna dan dimasukkan kembali ke dalam data rekaman aktivitas yang disimpan dengan flag --save-assets.

Jika menggunakan flag --save-assets, Anda sekarang dapat melepaskan rekaman aktivitas ke DevTools atau membukanya di DevTools Timeline Viewer. Anda akan dapat melihat metrik utama dalam konteks dengan trace lengkap pemuatan halaman.

Data rekaman aktivitas

Penampil Lighthouse

Dalam laporan HTML, Anda akan melihat tombol baru dengan opsi untuk mengekspor laporan dalam format yang berbeda. Salah satu opsi tersebut adalah "Buka di Penampil". Dengan mengklik tombol ini, laporan akan dikirim ke Pelihat online, tempat Anda dapat membagikan laporan lebih lanjut kepada pengguna GitHub.

Tombol Buka di Pengakses lihat-saja
Buka di hasil Pelihat

Di balik layar, Viewer mendapatkan izin Anda melalui OAuth untuk membuat inti rahasia GitHub dan menyimpan laporan tersebut di sana. Karena hal ini dilakukan sebagai Gist, Anda memiliki kontrol penuh atas pembagian laporan dan Anda dapat menghapusnya kapan saja. Anda dapat mencabut izin Viewer untuk membuat gist di bagian setelan GitHub.

Eksperimen Performa

Versi pertama project Performance Experiment telah tersedia di versi 1.5.0. Hal ini memungkinkan Anda bereksperimen dengan performa pemuatan halaman, yang secara interaktif menguji efek pemblokiran atau penundaan aset di jalur penting Anda selama pengembangan.

Saat Lighthouse dijalankan dengan flag --interactive, laporan khusus akan dibuat yang memungkinkan pemilihan interaktif resource halaman yang mahal. Server eksperimen kemudian menjalankan kembali Lighthouse di halaman tersebut dengan resource yang diblokir.

Mengganti setelan runtime

Pelajari lebih lanjut Eksperimen Performa di Lighthouse.

Dokumentasi Baru

Yang tidak kalah pentingnya, kami telah memodernisasi dokumentasi di developers.google.com/web/tools/lighthouse/ dan menambahkan referensi audit baru.

Dokumentasi baru

Cukup untuk sekarang.

Untuk semua detail tentang hal terbaru di Lighthouse, lihat catatan rilis lengkap di GitHub. Seperti biasa, hubungi kami untuk melaporkan bug, mengajukan permintaan fitur, atau bertukar pikiran ide tentang apa yang ingin Anda lihat selanjutnya.