Halaman ini diterjemahkan oleh Cloud Translation API.

Yang baru di DevTools, Chrome 124

Sofia Emelianova

Panel Isi Otomatis baru

Versi ini menghadirkan panel Isi Otomatis baru ke DevTools. Isi Otomatis Chrome menyediakan cara yang mudah untuk mengisi formulir secara otomatis di situs dengan alamat yang tersimpan. Panel Isi Otomatis yang baru memungkinkan Anda memeriksa pemetaan antara kolom formulir, prediksi nilai isi otomatis, dan data yang tersimpan.

Coba panel baru di halaman demo ini dengan data pengujian:

Di Isi Otomatis Profil, klik tombol Isi formulir ..., klik Kirim, lalu, di jendela dialog Simpan alamat?, klik Simpan, dan kembali ke halaman yang berisi formulir tersebut.
Buka DevTools dan picu peristiwa isi otomatis: pilih kolom formulir dan pilih alamat dari menu drop-down.

Panel Isi Otomatis akan terbuka secara otomatis dan menampilkan kolom formulir yang terdeteksi, kolom yang disimpulkan isi otomatis, dan nilai yang tersimpan.

Panel Isi Otomatis.

Untuk mempelajari lebih lanjut, lihat Mempelajari Formulir dan Isi Otomatis.

Throttling jaringan yang ditingkatkan untuk WebRTC

Dengan tambahan baru parameter terkait paket ke profil throttling jaringan kustom, Anda kini dapat melakukan throttle pada aplikasi WebRTC langsung di DevTools. Hal ini berguna untuk menguji implementasi komunikasi real-time Anda, tanpa perlu menggunakan software pihak ketiga.

Parameter baru tersebut adalah: Kerugian Paket (persen), Panjang Antrean Paket (jumlah paket), dan tanda Penyusunan Ulang Paket check_box.

Untuk membatasi koneksi WebRTC, tentukan parameter terkait paket di profil kustom di setelan Setelan > Throttling, lalu pilih di panel Jaringan.

Coba parameter baru di halaman demo ini. Pertama, izinkan halaman menggunakan kamera. Kemudian, di panel Network, pilih profil kustom yang Anda konfigurasi, dan, kembali ke halaman, klik Start dan Call.

Masalah Chromium: 41175925.

Dukungan animasi berbasis scroll di panel Animasi

Panel Animasi kini memungkinkan Anda memeriksa animasi berbasis scroll.

Coba fitur ini di halaman demo ini. Buka panel Animasi lalu muat ulang halaman untuk merekam animasi berbasis scroll.

Sekumpulan animasi berbasis scroll yang ditandai dengan ikon mouse.

Grup animasi yang ditandai dengan ikon mouse mouse akan muncul di Ringkasan. Sekarang Anda dapat memeriksanya. Grup menampilkan nilai piksel, bukan milidetik di Linimasa.

Peningkatan dukungan penyusunan bertingkat CSS di Elemen > Gaya

Tab Elemen > Gaya meningkatkan dukungan penyusunan bertingkat CSS dan kini menampilkan gaya bertingkat dengan indentasi dan tanda kurung kurawal. Penyusunan bertingkat CSS adalah cara mengelompokkan aturan CSS dan membuat sesuatu menjadi lebih sederhana dan terstruktur.

Sebelum dan sesudah menambahkan indentasi dan menyertakan gaya bertingkat dalam tanda kurung kurawal.

Masalah Chromium: 40166888.

Panel Performa yang Ditingkatkan

Versi ini menghadirkan beberapa peningkatan pada panel Performance.

Menyembunyikan fungsi dan turunannya di flame chart

Untuk memfilter derau dari flame chart di Performance > Main, Anda kini dapat menyembunyikan fungsi yang tidak relevan dan turunannya. Dalam flame chart, klik kanan fungsi dan pilih opsi dari menu konteks.

Fungsi dengan turunan tersembunyi memiliki tombol Drop-down arrow_drop_down di sebelah kanan. Arahkan kursor ke atasnya untuk melihat jumlah turunan yang disembunyikan, lalu klik untuk menampilkannya lagi. Untuk kembali ke status awal flame chart, klik kanan fungsi, lalu pilih Reset trace.

Panah dari inisiator yang dipilih ke peristiwa yang mereka mulai

Sebelumnya, saat Anda memilih dan peristiwa di jalur Utama, jalur tersebut menampilkan panah dari inisiator ke peristiwa yang dipilih. Sekarang, trek juga menunjukkan panah dari peristiwa yang dipilih ke peristiwa yang dimulainya, jika ada.

Sebelum dan sesudah menampilkan panah dari peristiwa yang dipilih ke peristiwa yang dimulai dan tautan bernama, bukan Pengungkapan.

Selain itu, semua inisiator kini memiliki kolom Inisiator untuk di tab Ringkasan, serta kolom Inisiator for dan Dimulai oleh memiliki link bernama, bukan Reveal.

Masalah Chromium: 325604258, 325024819, 326055289.

Mercusuar 11.6.0

Panel Lighthouse sekarang menjalankan Lighthouse 11.6.0. Lihat daftar lengkap perubahan.

Salah satu perubahan penting adalah setelan keikutsertaan baru check_box_outline_blank Aktifkan pengambilan sampel JS. Setelan ini dinonaktifkan secara default.

Sebelum dan sesudah menambahkan setelan pengambilan sampel JS keikutsertaan.

Mengaktifkan pengambilan sampel JS akan menambahkan stack panggilan JavaScript yang mendetail ke trace performa, tetapi dapat memperlambat pembuatan laporan.

Trace performa tanpa (kiri) dan dengan sampling JS (kanan).

Trace tersedia di more_vert menu Alat > Lihat Rekaman Aktivitas yang Tidak Di-throttle setelah laporan Lighthouse dibuat.

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

Masalah Chromium: 772558.

Tooltip untuk kategori khusus di snapshot Memori > Heap

Snapshot heap di panel Memory memiliki grup objek khusus yang tidak didasarkan pada konstruktor. Saat Anda mengarahkan kursor ke objek tersebut, panel Memori kini akan menampilkan tooltip dengan deskripsi singkat dan link ke deskripsi yang lebih panjang dalam dokumentasi.

Karakter sebelum dan sesudah menampilkan tooltip deskriptif untuk kelompok objek khusus.

Masalah Chromium: 41490331.

Aplikasi > Update penyimpanan

Versi ini menghadirkan beberapa update untuk Application > Storage.

Byte digunakan untuk penyimpanan bersama

Bagian Aplikasi > Penyimpanan > Penyimpanan bersama kini menampilkan jumlah byte yang digunakan oleh tempat asal.

Angka sebelum dan sesudah menunjukkan jumlah byte yang digunakan untuk penyimpanan bersama.

Penyimpanan bersama memungkinkan Anda memiliki akses tulis penyimpanan lintas situs tanpa batas dengan akses baca yang menjaga privasi.

Masalah Chromium: 324464353.

Web SQL sepenuhnya tidak digunakan lagi

Chrome menghentikan Web SQL di versi 119 dan menghapus token uji coba penghentian penggunaan dalam versi ini, sehingga Anda tidak dapat lagi menggunakan Web SQL.

Setelah itu, DevTools menghapus bagian Web SQL dari panel Application.

Masalah Chromium: 327254049.

Peningkatan panel cakupan

Versi ini menghadirkan beberapa update pada panel Cakupan:

Status bar kini menghitung statistik penggunaan untuk URL yang difilter dengan benar. Sebelumnya, status bar hanya akan menambahkan data induknya, bukan menambahkan data penggunaan turunan yang cocok dengan filter.

Sebelum dan sesudah menghitung statistik turunan yang cocok dengan benar.

Warna kode yang digunakan sekarang menjadi abu-abu, bukan hijau, untuk meningkatkan visibilitas, terutama untuk kekurangan penglihatan warna hijau.

Sebelum dan sesudah mengubah warna kode yang digunakan menjadi abu-abu.

Masalah Chromium: 41494198, 329253687.

Panel Layers mungkin tidak digunakan lagi

Panel Layers mungkin tidak digunakan lagi dalam waktu dekat karena tingkat penggunaan yang rendah. Panel sekarang menampilkan banner peringatan di bagian atas.

Banner peringatan yang mengumumkan kemungkinan penghentian penggunaan di bagian atas panel Layers.

Jangan ragu untuk menyampaikan pendapat dan kekhawatiran Anda sebelum tim membuat keputusan akhir untuk menghentikan penggunaan panel.

Penghentian penggunaan JavaScript Profiler: Fase empat, terakhir

Dalam versi ini, panel JS Profiler sepenuhnya tidak digunakan lagi dan tidak dapat diaktifkan kembali.

Untuk membuat profil performa CPU, gunakan panel Performa.

Masalah Chromium: 40262073.

Sorotan lain-lain

Berikut adalah beberapa perbaikan dan peningkatan penting dalam rilis ini:

Jaringan:
- Memperbaiki bug terkait penguraian cookie multibaris yang salah (325410304).
- Memperbaiki pratinjau stack panggilan di kolom Inisiator (327665602).
Pemantauan performa: Kotak centang pelacakan kini sama seperti di UI lainnya (1467464).
Sumber: Menambahkan penyorotan sintaksis untuk dokumen XML (327940244).
Setelan > Perangkat: Galaxy Fold Lama diganti dengan Galaxy Z Fold 5 yang lebih baru (40113439).
Performa: Semua hasil penelusuran yang cocok kini ditandai saat melakukan penelusuran dengan Ctrl/Cmd+F (1523279).
Resource developer: Sekarang juga menampilkan resource yang dimuat melalui ekstensi bahasa, seperti ekstensi Chrome Dukungan C/C++ (DWARF) (40746829).
Performa: Memperbaiki stack panggilan yang dipangkas dan tata letaknya yang buruk di tab Summary (325314708).
Panel samping: Tombol tutup Tutup kini dapat difokuskan, sehingga panel dapat ditutup menggunakan keyboard.

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 tercanggih, dan menemukan masalah di situs Anda sebelum pengguna melakukannya.

Menghubungi tim Chrome DevTools

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

Kirim saran atau masukan kepada kami melalui crbug.com.
Laporkan masalah DevTools menggunakan Opsi lainnya > Bantuan > Laporkan masalah DevTools di DevTools.
Tweet di @ChromeDevTools.
Berikan komentar di video YouTube Apa yang baru di DevTools atau video YouTube Tips DevTools.