Langsung ke konten
Clinford Jordano Valencia
Semua proyek
WebPlatform

Core Web Vitals dan Performa Web di Traveloka

Optimasi performa pada halaman bertrafik tinggi yang krusial bagi konversi, berdasarkan pengukuran pengguna nyata dan anggaran performa.

Peran
Software Engineer (Web)
Periode
2018–2025
Stack
Core Web Vitals · Next.js · Real-user monitoring · Code splitting

Masalahnya

Ini adalah pengalaman web bertrafik tinggi yang krusial bagi konversi, jadi performa harus diukur dari apa yang benar-benar dialami pengguna, bukan dari laptop developer.

Pendekatannya

  • Ukur pengguna nyata lebih dulu. Pengukuran pengguna nyata menentukan apa yang diperbaiki, dan anggaran performa mencegah regresi muncul kembali.
  • Kurangi JavaScript yang harus dijalankan browser: code splitting, lazy loading, dan optimasi dependensi.
  • Perbaiki sisa jalurnya: eksekusi JavaScript, rendering, jaringan, gambar, dan skrip pihak ketiga.

Membagikannya

Saya mengubah pelajaran ini menjadi talk: "Performance: Core Web Vitals Top Recommendations + INP" di DevFest Jakarta 2023, dan "Bridging the Gap: Making It Easier to Build for the Web" di Google I/O Extended Jakarta 2022.

Saya juga menulis tentangnya: event loop tidak seperti yang Anda kira menjelaskan long task di balik INP yang buruk dan cara memecahnya.