Digital Transformation
Web Vitals Attribution (Atribusi Metrik Web Vitals)
Web Vitals Attribution adalah teknik debugging yang mengaitkan skor LCP, INP, atau CLS ke elemen DOM, skrip, atau interaksi spesifik yang menyebabkannya, sehingga tim bisa memperbaiki akar masalah, bukan menebak.
TL;DR: Web Vitals Attribution adalah teknik diagnostik yang menempelkan informasi konteks ke setiap skor Core Web Vitals, misalnya elemen mana yang jadi LCP, skrip mana yang memblok INP, atau elemen mana yang menggeser layout. Dengan attribution, tim teknis dan marketer berhenti menebak dan langsung tahu titik perbaikan.
Apa itu Web Vitals Attribution?
Web Vitals Attribution adalah ekstensi dari library web-vitals yang menambahkan metadata penyebab ke setiap pengukuran. Tanpa attribution, kamu hanya tahu LCP halaman 3,4 detik. Dengan attribution, kamu tahu LCP itu berasal dari gambar hero hero-banner-2026.jpg, dimuat dari CDN yang menambah 1,1 detik latensi, dan render-blocked oleh CSS pihak ketiga selama 600 ms.
Library web-vitals resmi dari Google mendukung mode attribution sejak versi 3, dipublikasikan di GitHub web-vitals. Marketer tidak perlu jadi developer untuk pakainya, cukup minta tim teknis untuk mengaktifkan mode web-vitals/attribution dan kirim event ke GA4 atau RUM tool internal.
Apa yang Direkam Mode Attribution?
Mode attribution menambahkan field tambahan untuk tiap metrik:
- LCP: elemen LCP, sumber URL gambar, waktu [TTFB](/glosarium/ttfb-time-to-first-byte), render delay, load delay.
- INP: target interaksi (elemen yang diklik), durasi input handler, durasi presentation delay, long task yang terlibat.
- CLS: elemen yang menggeser layout terbesar, ukuran shift, posisi awal versus akhir.
Semua data ini bisa dikirim ke [analytics seperti CrUX atau RUM internal](/glosarium/core-web-vitals) untuk dipantau per halaman, per perangkat, atau per koneksi jaringan.
Kenapa Penting?
Attribution memotong waktu debugging dari hari ke jam. Marketer yang melaporkan LCP buruk ke developer cukup membawa data attribution lengkap, sehingga developer langsung tahu file mana yang perlu dioptimasi. Dalam praktik di proyek-proyek website bisnis terakhir, attribution sering mengungkap penyebab tak terduga seperti font Google yang lambat, video autoplay yang menggeser layout, atau widget chat pihak ketiga yang menambah 800 ms ke INP.
Pertanyaan Umum
Apakah Web Vitals Attribution menambah ukuran bundle?
Sedikit, sekitar 2-3 KB di-gzip. Manfaat debugging-nya jauh melebihi biaya bandwidth.
Apakah PageSpeed Insights menampilkan attribution?
PSI menampilkan diagnostik lab dan field data dari CrUX. Untuk attribution real user, kamu perlu integrasikan library web-vitals/attribution ke kode.
Istilah Terkait