Yang baru di DevTools, Chrome 126

Sofia Emelianova
Sofia Emelianova

Peningkatan panel performa

Versi ini menghadirkan beberapa peningkatan pada panel Performa.

Pindahkan dan sembunyikan trek dengan mode konfigurasi trek 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 arrow_upward ke atas atau arrow_upward ke bawah untuk memindahkan trek atau klik arrow_upward sembunyikan. Untuk keluar dari mode konfigurasi, klik Selesaikan konfigurasi jalur di bagian bawah. Konfigurasi ini tetap ada untuk trace baru, tetapi tidak untuk sesi DevTools berikutnya.

Masalah Chromium: 336266699.

Abaikan skrip dalam flame chart

Flame chart di jalur Utama menambahkan dukungan daftar pengabaian. 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 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 lambat 20x baru. Jadi, Anda kini dapat mereproduksi dan menganalisis masalah performa di dunia nyata dengan lebih akurat, bahkan pada komputer kelas atas.

Sebelum dan sesudah menambahkan opsi '20x lambatdonw' ke 'Setelan perekaman'.

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-fiturnya yang paling berguna ke panel Performa. Panel Insight performa kini menampilkan banner di bagian atas yang menginformasikan tentang penghentian yang akan datang.

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 apa saja yang berhasil, apa yang tidak, dan apa yang menurut Anda dapat dilakukan dengan lebih baik, kami ingin mendengar pendapat Anda.

Tempel seluruh string header untuk menggantinya

Saat mengganti header, kini Anda 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.

Periksa bucket penyimpanan di Aplikasi > Penyimpanan

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 tanda 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.

Kini 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 sekarang menjalankan Lighthouse 12.0.0.

Pembaruan ini menghadirkan sejumlah perubahan, termasuk penghapusan kategori PWA, reorganisasi kategori SEO, penghentian penggunaan 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 gambar lambat (Aktifkan instrumentasi paint lanjutan dan Aktifkan statistik pemilih CSS) kini otomatis dihapus di sesi DevTools berikutnya.
    • Tab Selector Stats sekarang tidak otomatis di-scroll ke bagian bawah saat Anda memperbesar flame chart dan perubahan data (337999939).
  • Konsol: Pintasan Ctrl+` kini menutup Konsol di panel samping hanya jika sedang fokus (40875466, 328210785).
  • Isi otomatis: Penguraian alamat telah diperbaiki (335409093, 335409707).
  • Aksesibilitas: Pengumuman pembaca layar untuk string yang dilokalkan telah diperbaiki (324930007).

Mendownload saluran pratinjau

Pertimbangkan untuk menggunakan Chrome Canary, Dev, atau Beta sebagai browser pengembangan default Anda. Saluran pratinjau ini memberi Anda akses ke fitur DevTools terbaru, menguji API platform web mutakhir, dan menemukan masalah di situs Anda sebelum pengguna melakukannya.

Menghubungi tim Chrome DevTools

Gunakan opsi berikut untuk membahas fitur dan perubahan baru dalam postingan, atau hal lain yang terkait dengan DevTools.

  • Kirim saran atau masukan kepada kami melalui crbug.com.
  • Laporkan masalah DevTools menggunakan Opsi lainnya   Lainnya   > Bantuan > Laporkan masalah DevTools di DevTools.
  • Tweet di @ChromeDevTools.
  • Tulis komentar di Video YouTube yang baru di DevTools atau Tips DevTools Video YouTube.

Yang baru di DevTools

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

Chrome 126

Chrome 125

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113

Chrome 112

Chrome 111

Chrome 110

109 Chrome

Chrome 108

Chrome 107

106 Chrome

105 Chrome

104 Chrome

103 Chrome

102 Chrome

101 Chrome

100 Chrome

Chrome 99

Chrome 98

Chrome 97

Chrome 96

Chrome 95

Chrome 94

Chrome 93

Chrome 92

Chrome 91

Chrome 90

Chrome 89

Chrome 88

Chrome 87

Chrome 86

Chrome 85

Chrome 84

Chrome 83

Chrome 82

Chrome 82 dibatalkan.

Chrome 81

Chrome 80

Chrome 79

Chrome 78

Chrome 77

Chrome 76

Chrome 75

Chrome 74

Chrome 73

Chrome 72

Chrome 71

Chrome 70

Chrome 68

Chrome 67

Chrome 66

Chrome 65

Chrome 64

Chrome 63

Chrome 62

Chrome 61

Chrome 60

Chrome 59