Yang baru di DevTools, Chrome 126

Sofia Emelianova
Sofia Emelianova
GitHub

Peningkatan panel performa

Versi ini menghadirkan beberapa peningkatan pada panel Performa.

Memindahkan dan menyembunyikan jalur dengan mode konfigurasi jalur yang diperbarui

Sekarang Anda dapat memasuki mode konfigurasi trek dengan mengklik kanan nama trek dan memilih Konfigurasi trek. Tombol edit yang memerlukan ruang tambahan telah dihapus.

Sebelum dan sesudah mengganti tombol edit dengan opsi menu.

Mode konfigurasi jalur memungkinkan Anda mengubah urutan jalur dan menyembunyikannya. Klik ke atas atau ke bawah untuk memindahkan jalur atau klik untuk menyembunyikan. Untuk keluar dari mode konfigurasi, klik Selesai mengonfigurasi jalur di bagian bawah. Konfigurasi ini tetap ada untuk rekaman aktivitas baru, tetapi tidak untuk sesi DevTools berikutnya.

Masalah Chromium: 336266699.

Mengabaikan skrip dalam diagram percik

Diagram lingkaran api di jalur Main menambahkan dukungan daftar yang diabaikan. Sekarang Anda dapat mengklik kanan skrip di diagram dan memilih Tambahkan skrip ke daftar yang diabaikan.

Opsi menu untuk menambahkan skrip ke daftar yang diabaikan, skrip yang ditandai sebagai diabaikan, dan aturan yang sesuai di Setelan.

Diagram ini menciutkan skrip yang diabaikan, menandainya sebagai Di daftar yang diabaikan, dan menambahkannya ke Aturan pengecualian kustom di Setelan > Daftar yang diabaikan. Skrip yang diabaikan akan disimpan hingga Anda menghapusnya dari rekaman aktivitas atau dari Aturan pengecualian kustom.

Masalah Chromium: 336266714.

Mengurangi kecepatan CPU sebanyak 20 kali

Menu throttling CPU di Setelan pengambilan pada panel Performa mendapatkan opsi Pemendekan waktu 20x baru. Jadi, kini Anda dapat mereproduksi dan menganalisis masalah performa di dunia nyata secara lebih akurat, bahkan di komputer kelas atas.

Sebelum dan sesudah menambahkan opsi '20x slowdonw' ke 'Setelan pengambilan'.

Masalah Chromium: 324978881.

Panel insight performa tidak akan digunakan lagi

Panel Insight performa eksperimental tidak akan digunakan lagi pada tahun 2024. Tim DevTools sedang berupaya mengintegrasikan fitur yang paling berguna ke panel Performa. Panel Insight performa kini menampilkan banner di bagian atas yang memberi tahu Anda tentang penghentian mendatang.

Banner peringatan penghentian penggunaan di panel 'Insight performa'.

Untuk mempelajari lebih lanjut, lihat Alat performa pada tahun 2024 dan seterusnya.

Jika Anda memiliki masukan tentang hal yang berhasil, hal yang tidak berhasil, dan hal yang menurut Anda dapat dilakukan dengan lebih baik, kami ingin mendengar pendapat Anda.

Tempelkan seluruh string header untuk menggantinya

Saat mengganti header, Anda kini dapat menempelkan seluruh string header (HEADER_NAME: VALUE) dan DevTools akan membagi string di : menjadi nama header dan nilainya.

Lihat cara kerjanya dalam video berikut.

Saat mengedit header, panel Jaringan kini memperingatkan Anda jika Anda memasukkan karakter selain alfanumerik, tanda hubung, dan garis bawah.

Peringatan di samping nama header dengan karakter yang tidak didukung.

Selain itu, opsi menu penggantian dan tombol Edit dinonaktifkan untuk URL chrome://, yang cocok dengan perilaku yang diinginkan.

Masalah Chromium: 330967147, 337012362, 328210785.

Menemukan penggunaan memori yang berlebihan dengan filter baru di snapshot heap

Snapshot heap di panel Memory mendapatkan filter baru yang dapat membantu Anda menemukan kasus umum penggunaan memori yang tidak efisien, seperti string duplikat, objek yang dipertahankan oleh node DOM yang terpisah, dan Konsol DevTools.

Opsi filter sebelum dan sesudah penambahan untuk kasus umum penggunaan memori yang tidak efisien.

Masalah Chromium: 337094903.

Memeriksa bucket penyimpanan di Application > Storage

Anda kini dapat memeriksa bucket penyimpanan dalam hierarki khusus di bagian Aplikasi > Penyimpanan. Hierarki ini, yang sebelumnya bersifat eksperimental, telah diaktifkan secara default.

Sebelum dan sesudah mengaktifkan hierarki bucket penyimpanan di bagian Penyimpanan.

Masalah Chromium: 338094915.

Menonaktifkan peringatan XSS mandiri dengan flag command line

Jika Anda mengotomatiskan penggunaan Chrome atau membuka DevTools dari command line untuk proses debug, Anda sering kali ingin menonaktifkan peringatan XSS mandiri yang muncul di setiap sesi DevTools baru.

Dialog peringatan self-xss di Konsol.

Sekarang Anda dapat menonaktifkan dialog ini dengan meneruskan tanda command line --unsafely-disable-devtools-self-xss-warnings ke Chrome.

Masalah Chromium: 41491762.

Lighthouse 12.0.0

Panel Lighthouse kini menjalankan Lighthouse 12.0.0.

Update ini menghadirkan sejumlah perubahan, termasuk penghapusan kategori PWA, reorganisasi kategori SEO, penghentian Penghematan Keseluruhan, audit baru, dan perubahan audit. Lihat daftar lengkap perubahan.

Untuk mempelajari dasar-dasar penggunaan panel Lighthouse di DevTools, lihat Lighthouse: Mengoptimalkan kecepatan situs.

Masalah Chromium: 772558.

Sorotan lainnya

Berikut adalah beberapa perbaikan dan peningkatan penting dalam rilis ini:

  • Performa:
    • Setelan pengambilan lambat (Aktifkan instrumentasi paint lanjutan dan Aktifkan statistik pemilih CSS) kini otomatis dihapus di sesi DevTools berikutnya.
    • Tab Statistik Pemilih kini tidak otomatis di-scroll ke bawah saat Anda memperbesar diagram lingkaran api dan data berubah (337999939).
  • Konsol: Pintasan Ctrl+` kini menutup Konsol di panel samping hanya jika fokusnya aktif (40875466, 328210785).
  • Isi otomatis: Pemrosesan alamat telah diperbaiki (335409093, 335409707).
  • Aksesibilitas: Pengumuman pembaca layar untuk string yang dilokalkan telah diperbaiki (324930007).

Mendownload saluran pratinjau

Sebaiknya gunakan Chrome Canary, Dev, atau Beta sebagai browser pengembangan default Anda. Saluran pratinjau ini memberi Anda akses ke fitur DevTools terbaru, memungkinkan Anda menguji API platform web canggih, dan membantu Anda menemukan masalah di situs sebelum pengguna melakukannya.

Hubungi tim Chrome DevTools

Gunakan opsi berikut untuk membahas fitur baru, update, atau hal lain yang terkait dengan DevTools.

Yang baru di DevTools

Daftar semua yang telah dibahas dalam seri Yang baru di DevTools.