Core Web Vitals adalah metrik performa esensial yang secara langsung berdampak pada peringkat SEO dan pengalaman pengguna. Pada tahun 2026, tiga metrik inti adalah LCP (Largest Contentful Paint), INP (Interaction to Next Paint), dan CLS (Cumulative Layout Shift).
Tiga Metrik Inti (2026)
1. Largest Contentful Paint (LCP)
Target: 2,5 detik atau kurang
LCP mengukur performa loading—khususnya kapan elemen konten terbesar yang terlihat dimuat.
Strategi Optimasi:
- Optimalkan waktu respons server (TTFB < 800ms)
- Gunakan format gambar modern (AVIF, WebP)
- Implementasikan preload untuk resource kritis
- Eliminasi resource yang memblokir rendering
- Gunakan CDN untuk pengiriman konten global
- Aktifkan strategi caching yang tepat
2. Interaction to Next Paint (INP)
Target: Kurang dari 200 milidetik
INP menggantikan FID pada Maret 2024 dan mengukur responsivitas di sepanjang seluruh siklus hidup halaman.
Strategi Optimasi:
- Pecah tugas JavaScript yang panjang (< 50ms)
- Gunakan code splitting dan lazy loading
- Tunda JavaScript non-kritis
- Optimalkan event handler
- Gunakan web worker untuk komputasi berat
- Minimalkan dampak script pihak ketiga
3. Cumulative Layout Shift (CLS)
Target: 0,1 atau kurang
CLS mengukur stabilitas visual—seberapa banyak pergeseran layout tak terduga yang terjadi.
Strategi Optimasi:
- Tetapkan width/height eksplisit pada gambar dan video
- Cadangkan ruang untuk iklan dan embed
- Gunakan font-display: swap untuk web font
- Hindari menyisipkan konten di atas konten yang sudah ada
- Gunakan CSS aspect-ratio untuk elemen responsif
Alat Pengukuran
Field Data (Pengguna Nyata):
- Google Search Console
- Chrome User Experience Report (CrUX)
- PageSpeed Insights
- Solusi Real User Monitoring (RUM)
Lab Data (Pengujian Sintetis):
- Lighthouse
- Chrome DevTools
- WebPageTest
- PageSpeed Insights
Optimasi Spesifik Platform
WordPress
Plugin Terbaik:
- Jetpack Boost (performa LCP terbaik)
- WP Rocket (caching komprehensif)
- NitroPack (optimasi all-in-one)
- LiteSpeed Cache (untuk server LiteSpeed)
Best Practice:
- Gunakan tema yang dioptimalkan untuk performa (GeneratePress, Kadence, Astra)
- Batasi plugin hanya yang esensial
- Implementasikan page dan object caching
- Optimalkan database secara berkala
- Gunakan hosting berkualitas
Shopify
Fokus Optimasi:
- Pilih tema yang ringan (Dawn direkomendasikan)
- Optimalkan gambar produk secara agresif
- Gunakan preload hint untuk resource kritis
- Audit dan minimalkan aplikasi
- Implementasikan lazy loading untuk konten below-fold
Dampak SEO
Core Web Vitals adalah faktor peringkat yang dikonfirmasi. Situs yang memenuhi ambang batas "Good" melihat:
- Peringkat pencarian lebih tinggi (terutama untuk query kompetitif)
- Peningkatan konversi 20-35%
- Pengurangan bounce rate 15-25%
- Performa mobile-first indexing yang lebih baik
Mobile vs Desktop
Google memperlakukan Core Web Vitals mobile dan desktop secara terpisah. Dengan mobile-first indexing, prioritaskan optimasi mobile sambil mempertahankan performa desktop.
Tantangan Mobile:
- Prosesor lebih lambat
- Kondisi jaringan yang bervariasi
- Resource terbatas
- Layar lebih kecil
Poin Penting
- Field Data Paling Penting - Google menggunakan data pengguna nyata dari CrUX untuk peringkat
- LCP Sering Paling Mudah Diperbaiki - Optimasi gambar memberikan quick win
- INP Paling Menantang - Membutuhkan optimasi JavaScript yang cermat
- CLS Mencegah Quick Fix - Membutuhkan perencanaan layout yang hati-hati
- Pemantauan Berkelanjutan Diperlukan - Performa menurun seiring waktu tanpa perhatian
- Performa Mobile Kritis - 60%+ traffic berasal dari perangkat mobile
- Kesuksesan WordPress Bergantung pada Konfigurasi - Kombinasi plugin yang tepat sangat penting
Checklist Implementasi
Server & Hosting:
- TTFB di bawah 800ms
- HTTP/2 atau HTTP/3 diaktifkan
- Server-side caching diimplementasikan
- Kompresi Gzip/Brotli aktif
Gambar:
- Format modern (AVIF/WebP) dengan fallback
- Gambar responsif dengan srcset
- Atribut width/height pada semua gambar
- Lazy loading untuk gambar below-fold
- Gambar above-fold menggunakan loading="eager"
JavaScript:
- JS kritis di-inline
- JS non-kritis ditunda
- Code splitting diimplementasikan
- Script pihak ketiga dioptimalkan
- Tugas panjang dipecah (< 50ms)
CSS:
- CSS kritis di-inline
- CSS non-kritis ditunda
- CSS yang tidak digunakan dihapus
- CSS diminifikasi
Caching:
- Max-age panjang untuk aset statis
- Header Cache-Control yang tepat
- ETag diaktifkan
- Browser caching dikonfigurasi
Pemantauan:
- Pemantauan Search Console aktif
- Pengecekan PageSpeed Insights bulanan
- Solusi RUM diimplementasikan (opsional)
- Performance budget ditetapkan
Kesimpulan
Optimasi Core Web Vitals memerlukan pendekatan berlapis yang mencakup performa server, optimasi aset, efisiensi kode, dan pemantauan berkelanjutan. Kesuksesan datang dari memperlakukan performa sebagai komitmen berkelanjutan daripada proyek satu kali.
Fokus pada fundamental: hosting cepat, gambar teroptimasi, JavaScript minimal, dan caching yang tepat. Peningkatan inti ini memberikan dampak terbesar di semua tiga metrik Core Web Vitals.
Panduan ini mensintesis wawasan dari web.dev, Google Search Central, dan ahli performa industri untuk memberikan strategi Core Web Vitals yang komprehensif untuk 2026.