Interaction Budget: Cara Pangkas INP dan Naikkan Konversi Website Bisnis 2026

TL;DR: Interaction budget adalah plafon waktu yang Anda alokasikan untuk merender setiap interaksi pengguna. Untuk lulus metrik INP Google, total input delay, processing, dan presentation harus di bawah 200 ms. Disiplin sederhana ini sering pangkas INP dari rentang merah ke hijau, dan terjemahannya ke konversi bisa naik 8-15%.

Tahun lalu, salah satu landing page klien e-commerce di Jakarta mengalami penurunan konversi 12% dalam tiga bulan tanpa perubahan trafik atau penawaran. LCP-nya hijau, struktur halaman juga sama. Yang berubah ternyata INP, naik dari 180 ms ke 480 ms karena tim engineering menambah tracking pixel dan A/B test tool secara bertahap. Inilah masalah yang interaction budget coba selesaikan.

Pesannya sederhana: kalau Anda tidak tetapkan plafon waktu respons UI, fitur baru akan terus menggerogoti budget sampai pengguna merasa antarmuka lambat tanpa tahu kenapa.

Apa itu Interaction Budget

Interaction budget adalah anggaran waktu rendering tiap interaksi: klik, ketuk, ketikan. Lihat detail di glosarium interaction budget. Tiap interaksi punya tiga komponen yang dijumlahkan oleh metrik INP: input delay, processing time, dan presentation delay. Total ketiganya yang Anda alokasikan jadi budget.

Plafon yang umum dipakai industri:

Jika satu komponen terlampaui terus-menerus, INP halaman akan masuk zona kuning atau merah. Dan INP buruk berkorelasi dengan bounce rate naik dan konversi turun.

Kenapa Banyak Tim Lupa Budget Ini

Berbeda dengan LCP yang sering jadi metrik utama saat optimasi awal, INP biasanya baru terlihat masalah setelah halaman live beberapa bulan. Penyebabnya: tracking pixel ditambah satu per satu, A/B test tool di-instal, chat widget diaktifkan, sampai akhirnya total beban third-party script naik tanpa ada yang sadar. Lihat third-party script tax di glosarium untuk dampak akumulatif jenis skrip ini.

Studi internal Google pada 2024 menunjukkan halaman dengan INP buruk punya conversion rate 24% lebih rendah dibanding yang baik. Untuk situs Indonesia yang sebagian besar trafiknya dari ponsel mid-range, angka ini biasanya lebih dramatis.

Studi Kasus: Pangkas INP dari 480 ke 140 ms

Saat optimasi sebuah landing page e-commerce parfum, INP awalnya 480 ms karena onclick handler memuat data dari 5 endpoint sekaligus. Tiga langkah yang kami pakai:

Pertama, pecah event handler jadi micro-tasks pakai requestIdleCallback. Data tidak kritis dimuat di idle time, bukan di event handler langsung. Ini pangkas processing time dari 220 ms ke 80 ms.

Kedua, pasang Web Worker untuk script analytics berat. Ini pangkas input delay dari 80 ms ke 30 ms.

Ketiga, ganti rerender state besar pakai useTransition di React. Ini pangkas presentation delay dari 180 ms ke 30 ms.

Total INP turun dari 480 ms ke 140 ms dalam 2 minggu. Konversi naik 11% di 30 hari berikutnya tanpa perubahan copy atau penawaran.

Cara Tetapkan Budget di Tim

Tetapkan plafon 200 ms total per interaksi sebagai default tim. Tiap fitur baru wajib lulus benchmark sebelum merge ke main branch. Untuk komponen berat seperti rich text editor atau peta interaktif, beri budget khusus dengan justifikasi bisnis tertulis. Web.dev punya panduan benchmark INP yang bisa jadi rujukan tim engineering.

Tools yang saya pakai untuk monitor:

• Chrome DevTools Performance tab untuk audit ad-hoc
• Web Vitals extension untuk lihat real-time metric
• CrUX dashboard untuk lihat data pengguna asli, bukan lab

Pertanyaan Umum

Apakah interaction budget sama dengan TBT?

Tidak. TBT mengukur seberapa lama main thread terblokir saat load halaman. Interaction budget mengukur respons setelah halaman dimuat, dan jadi dasar metrik INP yang berbeda dari TBT.

Bagaimana cek INP halaman saya sekarang?

Pasang Web Vitals extension di Chrome, lalu interaksi dengan halaman. Atau lihat di PageSpeed Insights bagian Core Web Vitals Assessment. Data CrUX di sana mengambil persentil 75 pengguna asli.

Berapa lama optimasi INP biasanya?

Untuk situs sederhana, 1-2 minggu cukup. Untuk e-commerce kompleks dengan banyak third-party script, 4-8 minggu termasuk testing.

Apakah INP berdampak ke SEO?

Ya. Sejak Maret 2024, INP menggantikan FID sebagai salah satu sinyal Core Web Vitals untuk peringkat Google. INP buruk ikut menurunkan kemampuan halaman bersaing di hasil pencarian.

Yang Saya Lakukan Mulai Sprint Ini

Audit halaman terpenting (landing, checkout, kategori produk), tetapkan plafon 200 ms per interaksi, dan tambahkan benchmark INP ke definition of done tiap fitur baru. Tiga disiplin ini cukup untuk pertahankan INP di hijau bahkan saat fitur terus bertambah.