Memahami Intervensi Iklan Berat Chrome

Dipublikasikan: 22 September 2025, Terakhir diperbarui: 7 Januari 2026

Bagi pengguna, tidak ada yang lebih menjengkelkan daripada halaman web yang tiba-tiba melambat, menguras baterai, atau menghabiskan kuota data bulanan mereka. Terkadang, penyebabnya bukan konten yang ingin mereka lihat, tetapi iklan yang berjalan di latar belakang.

Untuk melindungi pengalaman pengguna, Chrome menerapkan batasan pada resource yang dapat digunakan iklan. Jika iklan melampaui batas ini—menjadi iklan berat—Chrome akan membatalkan pemuatannya untuk mengosongkan resource perangkat.

Dokumentasi ini menjelaskan cara kerja intervensi ini, nilai minimum spesifik yang terlibat, dan beberapa praktik terbaik yang dapat Anda gunakan untuk memastikan iklan berjalan lancar.

Apa yang dimaksud dengan intervensi iklan berat?

Intervensi iklan berat adalah mekanisme di Chrome yang memantau penggunaan resource frame iklan. Jika iklan menggunakan bandwidth atau daya pemrosesan CPU dalam jumlah yang tidak proporsional, Chrome akan membatalkan pemuatan frame iklan tertentu tersebut.

Pengguna akan melihat kotak abu-abu dengan pesan yang menyatakan Iklan dihapus, bukan iklan, yang biasanya disertai dengan link Detail yang menjelaskan bahwa iklan menggunakan terlalu banyak resource.

Kotak abu-abu berlabel 'Iklan dihapus' dengan link 'Detail', yang muncul sebagai pengganti iklan berat yang melampaui batas resource.
Contoh tampilan iklan setelah dihapus.

Kapan iklan dianggap berat?

Chrome menentukan bahwa iklan berat berdasarkan tiga nilai minimum tertentu. Jika iklan belum berinteraksi dengan pengguna dan memenuhi salah satu kriteria berikut, iklan akan dibatalkan pemuatannya:

  • Penggunaan jaringan: Iklan menggunakan bandwidth jaringan lebih dari empat megabyte.
  • Penggunaan CPU puncak: Iklan menggunakan thread utama selama lebih dari 15 detik dalam jangka waktu 30 detik.
  • Total penggunaan CPU: Iklan menggunakan thread utama selama lebih dari 60 detik. Semua resource yang digunakan oleh iframe turunan dari frame iklan dihitung terhadap batas untuk intervensi pada iklan tersebut.

Apa saja pemicu umum untuk intervensi ini?

Jenis perilaku iklan tertentu lebih cenderung memicu intervensi ini daripada yang lain. Penyebab umumnya meliputi:

  • Media yang tidak dikompresi: Memuat gambar yang sangat besar dan dikompresi dengan buruk.
  • JavaScript Berat: Melakukan operasi yang ekstensif, seperti mendekode file video menggunakan JavaScript.
  • Penghitungan berat: Melakukan penghitungan yang rumit di latar belakang.
  • Konten video tanpa gestur: Memuat file video besar sebelum pengguna berinteraksi dengan iklan.

Apa yang terjadi jika iklan dihapus?

Saat mendeteksi bahwa iklan telah melampaui batas iklan berat, Chrome akan segera mengambil tindakan untuk melindungi resource perangkat pengguna.

Pengalaman pengguna

Dari sudut pandang pengguna, iklan akan segera dibatalkan pemuatannya. Sebagai gantinya, Chrome menampilkan kotak abu-abu dengan pesan: Iklan dihapus. Jika pengguna mengklik Detail dalam penampung, mereka akan melihat penjelasan tertentu.

Pengalaman developer

Chrome juga membuat laporan intervensi dengan Reporting API untuk memberi tahu Anda apa yang sebenarnya terjadi. Sebelumnya, laporan ini hanya dikirim ke frame iklan itu sendiri dan frame turunannya. Namun, penayang sering kali tidak mengetahui bahwa iklan di halaman mereka sendiri dihapus. Untuk mengatasi hal ini, Chrome telah memperluas mekanisme pelaporan. Laporan intervensi kini dikirim ke frame penyematan (induk dari frame iklan root) selain ke frame iklan itu sendiri. Laporan yang dikirim ke frame penyematan mencakup ID frame turunan dan URL frame iklan.

Untuk mengonfigurasi halaman untuk laporan HTTP, respons harus menyertakan header Report-To:

Reporting-Endpoints: default="https://example.com/reports"

Permintaan POST yang dipicu akan menyertakan laporan seperti ini:

POST /reports HTTP/1.1
Host: example.com

Content-Type: application/report

[{
 "type": "intervention",
 "age": 60,
 "url": "https://example.com/url/of/ad.html",
 "body": {
   "sourceFile": null,
   "lineNumber": null,
   "columnNumber": null,
   "id": "HeavyAdIntervention",
   "message": "Ad was removed because its CPU usage exceeded the limit. See https://www.chromestatus.com/feature/4800491902992384?utm_source=devtools"
 }
}]

Frame penyematan akan menerima laporan serupa, yang ditujukan ke URL frame penyematan, tetapi pesan juga akan berisi ID frame turunan dan URL spesifik frame turunan:

...
"message": "Ad was removed because its CPU usage exceeded the limit. See https://www.chromestatus.com/feature/4800491902992384?utm_source=devtools (id=123;url=http://example2.com/pre-redirect-ad-url.html)"
...

Javascript API menyediakan ReportingObserver dengan metode observe() yang dapat digunakan untuk memicu callback yang disediakan pada intervensi. Hal ini dapat berguna jika Anda ingin melampirkan informasi tambahan ke laporan untuk membantu proses debug.

// callback that will handle intervention reports
function sendReports(reports) {
  for (let report of reports) {
    // Log the `report` json using your own reporting process
    navigator.sendBeacon('https://report.example/your-endpoint', report);
  }
}

// create the observer with the callback
const observer = new ReportingObserver(
  (reports, observer) => {
    sendReports(reports);
  },
  { buffered: true }
);

// start watching for interventions
observer.observe();

Karena intervensi membongkar halaman iframe (misalnya, iklan), gunakan peristiwa pagehide untuk memastikan callback pelaporan merekam laporan intervensi sebelum halaman menghilang.

window.addEventListener('pagehide', (event) => {
  // pull all pending reports from the queue
  let reports = observer.takeRecords();
  sendReports(reports);
});

JSON yang dihasilkan dari JavaScript mirip dengan JSON yang dikirim pada permintaan POST:

[
  {
    type: 'intervention',
    url: 'https://example.com/url/of/ad.html',
    body: {
      sourceFile: null,
      lineNumber: null,
      columnNumber: null,
      id: 'HeavyAdIntervention',
      message:
        'Ad was removed because its network usage exceeded the limit. See https://www.chromestatus.com/feature/4800491902992384',
    },
  },
];

Praktik terbaik untuk developer

Untuk mencegah iklan Anda berada di bawah banner iklan berat, pertimbangkan praktik terbaik berikut:

  • Mewajibkan interaksi pengguna untuk konten berat: Kriteria intervensi berlaku untuk iklan yang belum berinteraksi dengan pengguna. Jika pengguna mengklik atau mengetuk iklan Anda, batas resource tidak lagi berlaku. Untuk pengalaman video atau multimedia, tunggu gestur pengguna (seperti "klik untuk memutar") sebelum memuat aset berat.
  • Mengoptimalkan gambar dan video: Pastikan gambar dikompresi dan video dioptimalkan untuk web. Hindari memuat file video besar secara otomatis; sebagai gantinya, gunakan placeholder ringan hingga pengguna berinteraksi.
  • Audit penggunaan CPU: Animasi atau operasi Javascript yang kompleks yang memicu tata letak dan gambar berkelanjutan dapat meningkatkan penggunaan CPU. Gunakan alat untuk mengidentifikasi hambatan dalam kode yang mungkin membuat thread utama sibuk dalam jangka waktu yang lama.
  • Pantau frame turunan: Ingatlah bahwa jumlah resource mencakup semua yang ada di dalam iframe iklan Anda. Jika iklan Anda memuat piksel pelacakan atau sub-frame pihak ketiga, penggunaan resource-nya akan dihitung dalam batas Anda.
  • Mengisolasi konten non-iklan: Pisahkan frame konten non-iklan ke dalam domain yang berbeda atau pola yang dapat dikenali yang cenderung tidak dianggap sebagai domain iklan oleh kebijakan penyedia daftar filter.

Bagaimana cara men-debug dan mendiagnosis penyebab intervensi?

Untuk memecahkan masalah dan menyelesaikan intervensi iklan berat secara efektif, Anda harus memahami terlebih dahulu cara logika deteksi Chrome mengidentifikasi konten sebagai iklan, lalu menggunakan alat developer bawaan untuk mengaudit pemicu resource tertentu yang menyebabkan penghapusan

Bagaimana cara Chrome mendeteksi keberadaan iklan?

Chrome menandai konten sebagai iklan dengan mencocokkan permintaan resource dengan daftar filter. Logika deteksi berlaku untuk konten dalam iframe. Frame halaman utama tidak pernah dianggap terkait iklan, meskipun berisi skrip iklan. Perhatikan bahwa iframe yang dimuat dari resource yang cocok dengan daftar filter akan dianggap sebagai iklan meskipun konten non-iklan lainnya juga dimuat dari frame tersebut. Contohnya, pemutar video yang dimuat dalam iframe yang diberi tag sebagai iklan juga dapat memuat konten non-iklan.

Bagaimana cara memverifikasi deteksi iklan?

Sebagai developer, Anda dapat memverifikasi secara visual apakah Chrome telah berhasil mendeteksi konten Anda sebagai iklan menggunakan Chrome DevTools.

  • Menyoroti frame iklan: Di panel Rendering, pilih Soroti Frame Iklan, yang memberi kode warna merah pada frame iklan yang terdeteksi di layar.
  • Anotasi elemen: Di panel Elemen, iframe iklan yang terdeteksi akan menampilkan anotasi iklan di samping tag <iframe> pembuka.
  • Aktivitas jaringan: Di panel Jaringan, filter permintaan berdasarkan boolean Is ad-related.
  • Status iklan: Di panel aplikasi pada bagian Frame, frame yang diberi tag iklan akan menyertakan atribut Ad Status.

Bagaimana cara mendiagnosis penyebab intervensi?

Chrome menyediakan alat untuk mengaudit dan meningkatkan kualitas serta performa halaman web. Jalankan Lighthouse di Chrome DevTools untuk mendapatkan laporan tentang performa halaman Anda. Anda juga dapat melihat koleksi web.dev/fast dan mempelajari informasi selengkapnya tentang Data Web.

Penggunaan jaringan

Buka panel Jaringan di Chrome DevTools untuk melihat aktivitas jaringan keseluruhan untuk iklan. Centang opsi Nonaktifkan cache untuk mendapatkan hasil yang konsisten selama pemuatan berulang.

Panel Jaringan di Chrome DevTools yang menampilkan aktivitas jaringan yang direkam dengan opsi &#39;Nonaktifkan cache&#39; diaktifkan.
Panel Jaringan di DevTools.

Nilai yang ditransfer di bagian bawah halaman akan menunjukkan jumlah yang ditransfer untuk seluruh halaman. Untuk membatasi permintaan hanya pada permintaan yang terkait dengan iklan, gunakan input Filter di bagian atas.

Jika Anda menemukan permintaan awal untuk iklan, misalnya, sumber untuk iframe, gunakan tab Pemrakarsa dalam permintaan untuk melihat semua permintaan yang dipicu.

Tab Pemrakarsa di DevTools yang menampilkan urutan permintaan resource yang dipicu oleh frame iklan tertentu.
Tab inisiator untuk permintaan.

Mengurutkan keseluruhan daftar permintaan berdasarkan ukuran adalah cara yang baik untuk menemukan resource yang terlalu besar. Penyebab umumnya adalah gambar dan video yang belum dioptimalkan.

Daftar panel Jaringan DevTools diurutkan berdasarkan ukuran respons untuk mengidentifikasi file media besar yang tidak dioptimalkan.
Urutkan permintaan berdasarkan ukuran respons.

Selain itu, mengurutkan menurut nama dapat menjadi cara yang baik untuk menemukan permintaan yang berulang. Intervensi mungkin tidak dipicu oleh satu resource besar, tetapi oleh sejumlah besar permintaan berulang yang secara bertahap melebihi batas.

Penggunaan CPU

Panel Performa di DevTools akan membantu mendiagnosis masalah penggunaan CPU. Buka menu Setelan Perekaman. Gunakan drop-down CPU untuk memperlambat CPU sebanyak mungkin. Intervensi untuk CPU jauh lebih mungkin dipicu pada perangkat dengan daya yang lebih rendah daripada mesin pengembangan kelas atas.

Setelan pengambilan panel Performa di DevTools dengan dropdown pelambatan CPU yang dipilih untuk menyimulasikan hardware berdaya rendah dengan pelambatan 6x.
Aktifkan pembatasan jaringan dan CPU di panel Performa.

Selanjutnya, klik tombol Rekam untuk mulai merekam aktivitas. Anda mungkin ingin bereksperimen dengan waktu dan durasi perekaman, karena rekaman aktivitas yang panjang dapat memerlukan waktu yang cukup lama untuk dimuat. Setelah rekaman dimuat, Anda dapat menggunakan linimasa atas untuk memilih bagian rekaman. Berfokus pada area di grafik berwarna kuning, ungu, atau hijau solid yang mewakili pembuatan skrip, rendering, dan menggambar.

ringkasan rekaman aktivitas performa di DevTools, dengan diagram lingkaran yang memvisualisasikan waktu yang dihabiskan untuk berbagai aktivitas seperti pemuatan, pembuatan skrip, rendering, dan menggambar.
Ringkasan rekaman aktivitas di panel Performa.

Jelajahi tab Bottom-Up, Call Tree, dan Event Log di bagian bawah. Mengurutkan kolom tersebut menurut Waktu Mandiri dan Total Waktu dapat membantu mengidentifikasi hambatan dalam kode.

Tab Bottom-Up di panel Performa diurutkan berdasarkan &#39;Self Time&#39; untuk menunjukkan hambatan tertentu.
Urutkan menurut Waktu Mandiri di tab Bottom-Up.

File sumber terkait juga ditautkan di sana, sehingga Anda dapat membukanya melalui panel Sumber untuk memeriksa biaya setiap baris.

Waktu eksekusi ditampilkan di panel Sumber.
Waktu eksekusi yang ditampilkan di panel Sumber.

Masalah umum yang perlu dicari di sini adalah animasi yang dioptimalkan dengan buruk yang memicu tata letak dan gambar berkelanjutan atau operasi mahal yang tersembunyi dalam library yang disertakan.

Bagaimana cara melaporkan intervensi yang salah?

Jika konten non-iklan telah diberi tag seperti itu, pertimbangkan untuk mengubah kode guna menghindari kecocokan dengan aturan pemfilteran, atau berinteraksi langsung dengan pengelola EasyList untuk mengubah aturan pemfilteran. Perlu diingat bahwa intervensi iklan berat tidak memengaruhi frame dengan gestur pengguna, sehingga video dapat dikecualikan dengan mewajibkan klik pada tombol putar sebelum memuat konten. Jika EasyList tidak cocok dengan konten Anda, dan Chrome entah bagaimana salah mengklasifikasikan konten sebagai terkait iklan, Anda dapat mengajukan masalah kepada Chrome menggunakan template ini. Saat mengajukan masalah, sertakan contoh laporan intervensi yang diambil dan contoh URL untuk mereproduksi masalah.