Digital Transformation
LCP Sub-parts
TL;DR: LCP Sub-parts adalah pemecahan metrik LCP menjadi empat fase yang masing-masing punya penyebab dan solusi berbeda. Dengan memahami sub-parts, tim dapat menentukan bagian mana yang perlu dioptimasi: server, jaringan, sumber daya, atau rendering.
Apa itu LCP Sub-parts?
Google merekomendasikan memecah LCP menjadi empat sub-part agar diagnosis lebih akurat. Tanpa pemecahan ini, sulit menentukan apakah masalah ada di server, jaringan, asset, atau frontend rendering.
Empat Fase LCP
| Fase | Definisi | Optimasi Tipikal |
|---|---|---|
| TTFB | Waktu sampai byte pertama dari server | Edge runtime, CDN, caching |
| Resource Load Delay | Jeda antara TTFB dan permintaan sumber daya LCP | Preload, Priority Hints |
| Resource Load Duration | Lama download sumber daya LCP | Kompresi, format modern (AVIF, WebP) |
| Element Render Delay | Jeda setelah sumber daya tiba sampai dirender | Hindari blocking script, optimasi font |
Kenapa Penting?
Marketer dan developer Indonesia sering kehabisan budget optimasi karena memperbaiki bagian yang salah. Pada proyek Atmo LMS, sub-parts mengungkap bahwa Resource Load Duration sudah baik (gambar sudah AVIF), masalah ada di Element Render Delay karena CSS blocking. Fokus berubah, hasil naik signifikan.
Pertanyaan Umum
Bagaimana cara melihat LCP Sub-parts?
Pakai build web-vitals/attribution, lalu baca field attribution.timeToFirstByte, attribution.resourceLoadDelay, dan seterusnya.
Berapa target ideal tiap fase?
Patokan umum: TTFB di bawah 800 ms, Resource Load Delay di bawah 100 ms, Resource Load Duration di bawah 1.000 ms, Element Render Delay di bawah 200 ms.
Istilah Terkait