Chrome DevTools adalah serangkaian alat developer web yang langsung disertakan ke browser Google Chrome. DevTools memungkinkan Anda mengedit halaman dengan cepat dan mendiagnosis masalah dengan cepat, sehingga membantu Anda membuat situs yang lebih baik dan lebih cepat.
Mulai
Semua cara yang dilakukan untuk membuka Chrome DevTools.
Dapatkan info terkini terkait perubahan DevTools terbaru.
Serangkaian video singkat untuk membantu Anda mempelajari fitur di DevTools.

Perintah dan pintasan

Menyelesaikan tugas dengan cepat.
Membuka menu perintah, menjalankan perintah, membuka file, melihat tindakan lainnya, dan lainnya.
Baca dokumen
Referensi komprehensif pintasan keyboard.
Baca dokumen
Lihat tampilan dan perilaku halaman web saat JavaScript dinonaktifkan.
Baca dokumen
Menyimulasikan perangkat untuk membuat situs yang mengutamakan seluler.
Menemukan teks di seluruh aset yang dimuat dengan panel Telusuri.

Panel

Temukan kemampuan dari setiap panel DevTools.
Pelajari cara melihat dan mengubah DOM halaman.
Baca dokumen
Pelajari cara melihat dan mengubah CSS halaman.
Baca dokumen
Mencatat pesan ke dalam log dan menjalankan JavaScript.
Baca dokumen
Lihat dan edit file, buat cuplikan, debug JavaScript, dan siapkan ruang kerja.
Baca dokumen
Catat permintaan jaringan ke dalam log.
Baca dokumen
Mengevaluasi performa situs.
Baca dokumen
Menemukan masalah memori yang memengaruhi performa halaman, termasuk kebocoran memori, dan lainnya.
Baca dokumen
Periksa, ubah, dan debug aplikasi web, uji cache, lihat penyimpanan, dan lainnya.
Baca dokumen
Rekam, putar ulang, ukur alur pengguna, dan edit langkah-langkahnya.
Baca dokumen
Temukan kumpulan opsi yang memengaruhi rendering konten web.
Baca dokumen
Memeriksa dan men-debug alamat yang disimpan.
Menemukan dan memperbaiki masalah pada situs.
Pastikan halaman dilindungi sepenuhnya oleh HTTPS.
Memeriksa ArrayBuffer, TypedArray, atau DataView di JavaScript, serta WebAssembly dan memori aplikasi C++ Wasm.
Ganti string agen pengguna.
Uji situs Anda dengan memblokir permintaan jaringan.
Melihat informasi dan men-debug pemutar media per tab browser.
Memeriksa dan mengubah animasi.
Melacak perubahan pada HTML, CSS, dan JavaScript.
Temukan dan analisis kode JavaScript dan CSS yang tidak digunakan.
Periksa apakah peta sumber berhasil dimuat dan muat secara manual.
Identifikasi potensi peningkatan CSS.
Optimalkan kecepatan situs dengan panel Lighthouse.
Dapatkan hasil analisis yang bisa ditindaklanjuti tentang performa situs Anda.
Memantau performa beban dan runtime.
Melihat dan mengedit file sumber sekaligus memiliki akses ke panel lain.
Emulasi sensor perangkat.
Lihat metrik WebAudio API.
Emulasikan pengautentikasi.

Referensi setelan