DevTools
            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.
          
        
        
        
          
        
      
              
    DevTools mendukung berbagai tugas pengembangan web umum. Langsung lanjutkan ke halaman ini dan jelajahi beberapa fitur utama DevTools. Tidak tahu harus memulai dari mana atau ini pertama kalinya Anda menggunakan DevTools? Tonton pengantar DevTools.
  
            
          
        Mendapatkan bantuan AI
            Insight konsol dan bantuan AI membantu Anda men-debug dan memperbaiki error, performa, dan gaya visual JavaScript secara lebih efisien.
          
        
        
        
      Memahami performa
            Dapatkan gambaran menyeluruh dan yang dapat ditindaklanjuti tentang performa halaman Anda.
          
        
        
        
      Memeriksa resource
            Pelajari cara memeriksa resource yang dimuat oleh halaman dan mengeditnya dari browser.
          
        
        
        
      Menganalisis jaringan
            Menganalisis dan menimpa permintaan dan respons jaringan dengan cepat.
          
        
        
        
      Asisten AI & insight konsol
              
    Pelajari cara inovasi AI di DevTools memungkinkan Anda melakukan lebih banyak hal dengan lebih cepat.
  
            
          
        Mulai
            Izinkan Gemini membantu Anda menganalisis dan meningkatkan gaya visual, jaringan, sumber, dan performa situs.
          
        
        
        
      Dapatkan inspirasi
            Pelajari kasus penggunaan untuk bantuan AI di Chrome DevTools dan pelajari cara bantuan AI dapat mendukung alur kerja proses debug Anda di seluruh gaya visual, performa, dan lainnya.
          
        
        
        
      Memahami pesan konsol
            Pahami pesan dan error konsol di DevTools dan pelajari cara memperbaikinya - tanpa menyalin dan menempel.
          
        
        
        
      Tips DevTools
              Jelajahi serial video bulanan kami yang menjelaskan cara menggunakan DevTools untuk menyelesaikan masalah pengembangan web yang umum.
            
          
        Merekam dan menganalisis rekaman aktivitas performa
            Pelajari cara merekam rekaman aktivitas performa di DevTools dan menganalisisnya untuk mengidentifikasi dan memperbaiki masalah performa.
          
        
        
        
      Memantau Core Web Vitals secara live
            Men-debug masalah LCP dan menggunakan data CrUX untuk melihat apakah Anda men-debug pengalaman yang serupa dengan pengguna
          
        
        
        
      Menjelaskan caching
            Pelajari berbagai jenis cache browser dan cara memeriksa serta mengelolanya di Chrome DevTools.
          
        
        
        
      Membekukan layar & memeriksa elemen yang menghilang
            Mencoba memeriksa elemen, dan “poof” elemen tersebut hilang? Sepertinya kode Anda sedang bermain petak umpet dengan Anda.
          
        
        
        
      Mendapatkan insight performa
              Berbagai alat untuk membantu Anda mengukur dan mengoptimalkan berbagai aspek performa runtime: panel Performa, Lighthouse, dan lainnya.
            
          
        Ringkasan alat performa
            Pelajari semua fitur di panel Performa: cara merekam rekaman aktivitas performa, cara melihat dan menganalisis rekaman aktivitas, dan lainnya.
          
        
        
        
      Memantau performa Core Web Vitals lokal dan pengguna sebenarnya di DevTools
            Pelajari fitur DevTools baru seperti kalibrasi throttling CPU untuk membantu Anda mendasarkan keputusan proses debug performa pada data dari dunia nyata
          
        
        
        
      Sidebar Insight di panel Performa DevTools
            Pelajari insight performa baru, kecanggihan Lighthouse langsung di panel Performa DevTools.
          
        
        
        
      Berita & info terbaru
Memeriksa dan mengedit resource
Referensi fitur
            Pelajari semua fitur di panel Sumber: cara melihat dan mengedit file, men-debug JavaScript, dan menyiapkan ruang kerja.
          
        
        
        
          
        
      Siapkan ruang kerja
            Workspace memungkinkan Anda menyimpan perubahan yang Anda buat dalam DevTools ke kode sumber yang disimpan di komputer. Pelajari cara menyiapkan ruang kerja di project Anda sendiri.
          
        
        
        
          
        
      Menganalisis aktivitas jaringan
Panel jaringan
            Pelajari semua fitur di panel Jaringan: periksa isi respons dan permintaan, ganti header, dan lainnya.
          
        
        
        
          
        
      Memeriksa aktivitas jaringan
            Tutorial langsung untuk memandu Anda melakukan tugas umum di dalam panel Jaringan.
          
        
        
        
          
        
      Alat lainnya
              Temukan semua fitur dan kemampuan lainnya di DevTools.
            
          
        Elemen
            Pelajari cara melihat dan mengubah DOM halaman.
          
        
        
        
      Gaya
            Pelajari cara melihat dan mengubah CSS halaman.
          
        
        
        
      Perubahan
            Melacak perubahan pada HTML, CSS, dan JavaScript.
          
        
        
        
      Konsol
            Mencatat pesan ke dalam log dan menjalankan JavaScript.
          
        
        
        
      Performa
            Mengevaluasi performa situs.
          
        
        
        
      Memori
            Menemukan masalah memori yang memengaruhi performa halaman, termasuk kebocoran memori, dan lainnya.
          
        
        
        
      Aplikasi
            Periksa, ubah, dan debug aplikasi web, uji cache, lihat penyimpanan, dan lainnya.
          
        
        
        
      Animasi
            Memeriksa dan mengubah animasi.
          
        
        
        
      Perekam Suara
            Rekam, putar ulang, ukur alur pengguna, dan edit langkah-langkahnya.
          
        
        
        
      Rendering
            Temukan kumpulan opsi yang memengaruhi rendering konten web.
          
        
        
        
      Isi otomatis
            Memeriksa dan men-debug alamat yang disimpan.
          
        
        
        
      Masalah
            Menemukan dan memperbaiki masalah pada situs.
          
        
        
        
      Privasi & Keamanan
            Pastikan halaman dilindungi sepenuhnya oleh HTTPS.
          
        
        
        
      Media
            Melihat informasi dan men-debug pemutar media per tab browser.
          
        
        
        
      Sensor
            Emulasi sensor perangkat.
          
        
        
        
      WebAuthn
            Emulasikan pengautentikasi.