Digital Transformation
Web Vitals Budget (Anggaran Performa Halaman Web)
Web Vitals Budget adalah ambang batas angka untuk LCP, INP, dan CLS yang disepakati tim sebelum rilis, sehingga setiap fitur baru wajib menjaga halaman tetap di bawah anggaran performa.
TL;DR: Web Vitals Budget adalah angka batas untuk LCP, INP, dan CLS yang dipakai tim sebagai pagar performa sebelum kode masuk ke produksi. Anggaran ini mengubah Core Web Vitals dari laporan pasca-rilis menjadi gerbang pengambilan keputusan, sehingga marketer dan developer berbicara dalam metrik yang sama.
Apa itu Web Vitals Budget?
Web Vitals Budget adalah perjanjian internal tim soal angka maksimum yang boleh dicapai oleh tiga metrik utama Core Web Vitals: Largest Contentful Paint, Interaction to Next Paint, dan Cumulative Layout Shift. Anggaran ini tidak menggantikan ambang Google, tapi memberi marjin aman supaya halaman tetap lulus saat diukur di lapangan dengan kondisi jaringan dan perangkat yang lebih beragam.
Pendekatan ini meminjam logika anggaran biaya pada finance: tim menetapkan angka, mengukur konsumsi tiap rilis, lalu menutup celah sebelum membengkak. Tanpa anggaran, performa hanya menjadi laporan akhir bulan yang tidak pernah ditindaklanjuti.
Cara Menyusun Anggaran
| Metrik | Ambang Google | Saran Anggaran Internal |
|---|---|---|
| LCP | di bawah 2,5 detik | 2,0 detik |
| INP | di bawah 200 ms | 150 ms |
| CLS | di bawah 0,1 | 0,05 |
Marjin 20-30% di bawah ambang Google memberi ruang untuk variasi jaringan 3G dan perangkat menengah ke bawah yang masih dominan di pasar Indonesia. Anggaran dievaluasi tiap kuartal berdasarkan data field dari Chrome User Experience Report.
Kenapa Penting?
Tanpa anggaran, performa selalu kalah prioritas dengan fitur baru. Web Vitals Budget memaksa tim mempertimbangkan dampak performa di tahap perancangan, bukan setelah rilis. Untuk bisnis Indonesia yang mengandalkan trafik organik, anggaran ini menjaga halaman tetap kompetitif di hasil pencarian dan AI Overview, karena performa adalah salah satu sinyal pengalaman halaman yang masih dievaluasi Google per 2026.
Pertanyaan Umum
Apa bedanya Web Vitals Budget dengan performance budget biasa?
Performance budget biasa fokus pada ukuran aset (kilobyte JavaScript, jumlah request). Web Vitals Budget fokus pada metrik pengalaman akhir pengguna, sehingga lebih dekat dengan KPI bisnis seperti konversi.
Bagaimana cara menegakkan anggaran di pipeline rilis?
Pasang Lighthouse CI atau WebPageTest di alur CI/CD. Setiap pull request yang melampaui anggaran akan diblok atau dilabeli, sehingga diskusi performa terjadi sebelum kode digabung.
Istilah Terkait