Digital Transformation
Performance Budget (Anggaran Performa Web)
Performance Budget adalah batas terukur untuk metrik kecepatan dan ukuran aset web yang disepakati tim agar pengalaman pengguna tetap cepat sebelum fitur baru dirilis.
TL;DR: Performance Budget adalah angka batas yang disepakati tim, misalnya total JavaScript di bawah 170 KB atau LCP di bawah 2,5 detik, sebagai pagar agar performa website tidak diam-diam memburuk saat fitur baru ditambahkan. Tanpa budget, tim mudah menormalkan halaman lambat hingga konversi turun.
Apa itu Performance Budget?
Performance Budget adalah seperangkat batas kuantitatif untuk metrik performa web, mulai dari Core Web Vitals seperti LCP dan [INP](/glosarium/inp), ukuran bundle JavaScript, jumlah request, hingga total transfer size. Tim sepakat bahwa setiap perubahan tidak boleh melewati batas tersebut. Anggap saja seperti budget belanja bulanan: kalau kategori "fashion" jebol, ada konsekuensinya.
Konsep ini digagas Tim Kadlec dan dipopulerkan ulang oleh Google, terutama lewat dokumentasi resmi web.dev tentang performance budgets. Tujuannya satu, mengubah performa dari "nice to have" jadi syarat lulus deploy.
Jenis Metrik dalam Performance Budget
| Kategori | Contoh Metrik | Patokan Awal |
|---|---|---|
| User-centric | LCP, INP, CLS | LCP < 2,5 detik, INP < 200 ms, CLS < 0,1 |
| Quantity-based | Jumlah request, jumlah font | < 50 request, maksimal 2 keluarga font |
| Size-based | Total JS, total CSS, total image | JS < 170 KB gzip, CSS < 50 KB |
| Rule-based | Skor Lighthouse, skor PageSpeed | Performance > 90 di simulasi mobile |
Patokan di atas bukan angka mutlak. Tim e-commerce dengan banyak gambar produk biasanya butuh budget gambar lebih longgar, sementara tim media butuh budget script iklan yang ketat agar bounce rate tidak naik.
Kenapa Penting?
Tim marketing dan engineering sering punya tujuan berlawanan. Marketing ingin pasang tag manager, pixel, dan widget chat. Engineering ingin halaman ringan. Tanpa Performance Budget, biasanya marketing menang di awal dan kecepatan halaman pelan-pelan turun. Hasilnya, conversion rate ikut turun tanpa ada yang menyadari penyebabnya.
Performance Budget memberi bahasa bersama. Ketika tim ingin tambah fitur baru, percakapannya berubah dari "boleh dipasang nggak?" menjadi "ini akan menambah 80 KB, sementara budget kita tinggal 40 KB, mana yang mau kita ganti?". Pertanyaan kedua jauh lebih sehat.
Pertanyaan Umum
Berapa angka awal Performance Budget yang masuk akal untuk website bisnis Indonesia?
Untuk landing page bisnis berbasis WordPress atau Next.js, target awal yang realistis: total transfer di bawah 1 MB di simulasi mobile 4G, LCP di bawah 2,5 detik, dan total JS di bawah 200 KB gzip. Sesuaikan setelah audit awal.
Apakah Performance Budget bisa otomatis dijalankan di CI/CD?
Bisa. Lighthouse CI, Bundlewatch, atau SpeedCurve bisa mem-block pull request yang melewati batas, sehingga budget jadi pagar otomatis, bukan sekadar dokumen.
Istilah Terkait