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

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

Bagian sebelum dan sesudah mengganti tombol edit dengan opsi menu.

Mode konfigurasi trek memungkinkan Anda mengubah urutan trek 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.

Abaikan skrip dalam flame chart

Diagram lingkaran api di jalur Main menambahkan dukungan daftar yang diabaikan. Anda kini dapat mengklik kanan skrip di diagram, lalu 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 menciutkan skrip yang diabaikan, menandainya sebagai Di daftar yang diabaikan, dan menambahkannya ke Aturan pengecualian kustom di Setelan > Abaikan daftar. Skrip yang diabaikan akan disimpan hingga Anda menghapusnya dari trace atau dari Aturan pengecualian kustom.

Masalah Chromium: 336266714.

Menurunkan 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 penerapannya dalam video berikut.

Saat mengedit header, panel Jaringan kini akan 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 pengganti dan tombol Edit dinonaktifkan untuk chrome://-URL, yang cocok dengan perilaku yang diinginkan.

Masalah Chromium: 330967147, 337012362, 328210785.

Menemukan penggunaan memori yang berlebihan dengan filter baru dalam snapshot heap

Snapshot heap di panel Memori 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 dilepas, dan Konsol DevTools.

Sebelum dan sesudah penambahan opsi filter untuk kasus umum penggunaan memori yang tidak efisien.

Masalah Chromium: 337094903.

Memeriksa bucket penyimpanan di Application > Storage

Sekarang Anda dapat memeriksa bucket penyimpanan di hierarki khusus di bagian Application > Storage. Hierarki ini, yang sebelumnya bersifat eksperimental, telah diaktifkan secara default.

Sebelum dan sesudah mengaktifkan hierarki bucket penyimpanan di bagian Storage.

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, sering kali Anda perlu menonaktifkan peringatan XSS mandiri yang muncul di setiap sesi DevTools yang 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.

Mercusuar 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 lain-lain

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 sedang fokus (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 apa pun yang berkaitan dengan DevTools.

Yang baru di DevTools

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