Digital Transformation
Interaction Budget
Interaction budget adalah batas waktu rendering setiap interaksi pengguna agar tetap terasa responsif. Ambang aman: di bawah 200 ms untuk INP yang baik.
TL;DR: Interaction budget adalah anggaran waktu yang Anda alokasikan untuk merender setiap interaksi pengguna di sebuah halaman. Untuk lulus metrik INP Google, total waktu input delay, processing, dan presentation harus di bawah 200 ms pada persentil 75. Disiplin budget ini wajib untuk situs e-commerce dan SaaS yang punya banyak elemen interaktif.
Apa itu Interaction Budget?
Interaction budget adalah konsep manajemen kinerja yang menetapkan plafon waktu untuk tiap respons UI. Setiap klik, ketuk, atau ketikan punya 3 komponen: input delay, processing time, dan presentation delay. Total ketiganya yang diukur metrik INP. Jika budget sering terlampaui, pengguna merasa antarmuka lambat meski LCP-nya hijau.
Pembagian Budget
| Komponen | Budget Aman | Apa yang Memakannya |
|---|---|---|
| Input delay | < 50 ms | Long task di main thread |
| Processing | < 100 ms | Event handler berat, state update |
| Presentation | < 50 ms | Layout shift, rerender besar |
Kenapa Penting?
Untuk situs Indonesia yang sebagian besar trafiknya dari ponsel mid-range, interaction budget ketat adalah keharusan. Saya pernah optimasi sebuah landing page yang awalnya INP-nya 480 ms karena onclick handler memuat data dari 5 endpoint. Setelah dipecah jadi micro-tasks pakai requestIdleCallback dan event handler dipangkas, INP turun ke 140 ms dan konversi naik 11% dalam 30 hari. Web.dev punya panduan lengkap tentang INP yang layak dijadikan rujukan tim engineering.
Pertanyaan Umum
Apakah interaction budget sama dengan TBT?
Tidak. TBT (Total Blocking Time) hanya mengukur seberapa lama main thread terblokir saat load. Interaction budget mengukur waktu respons setiap interaksi setelah halaman dimuat dan jadi dasar metrik INP yang berbeda dari TBT.
Bagaimana cara membagi budget di tim?
Tetapkan plafon 200 ms total per interaksi sebagai default. Tiap fitur baru wajib lulus benchmark sebelum merge ke main branch. Library berat seperti rich text editor diberi budget khusus dengan justifikasi bisnis.
Istilah Terkait