Dengan mengukur Data Web pengguna yang sebenarnya, Rakuten 24 juga menemukan bahwa Largest Contentful Paint (LCP) yang baik dapat menyebabkan peningkatan rasio konversi sebesar 61,13%.
Rakuten 24 adalah toko online yang bekerja sama dengan produsen barang konsumsi multinasional dan domestik besar untuk menawarkan berbagai kebutuhan sehari-hari termasuk layanan kesehatan, minuman, perlengkapan hewan peliharaan, produk bayi, dan lainnya. Toko ini disediakan oleh Rakuten Group, Inc.—pemimpin global dalam layanan internet, dan merupakan salah satu yang terbaik di platform marketplace digital mereka di Jepang.
Memahami dampak performa web terhadap pengalaman pengguna, tim Rakuten 24 terus mengukur, mengoptimalkan, dan memantau Data Web Inti serta metrik lainnya.
Akibatnya, lebih dari 75% pengguna mereka mengalami Largest Contentful Paint (LCP), First Input Penundaan (FID), dan First Contentful Paint (FCP). Namun, mereka masih mengerjakan peningkatan Pergeseran Tata Letak Kumulatif (CLS).
Setelah menganalisis data halaman beranda, Rakuten 24 menemukan bahwa skor LCP yang baik dapat menghasilkan:
- Peningkatan rasio konversi hingga 61,13%.
- 26,09% dalam pendapatan per pengunjung.
- 11,26% dalam nilai pesanan rata-rata.
- Skor FID yang baik dapat menyebabkan peningkatan rasio konversi hingga 55,88%.
Untuk menghubungkan Data Web Inti dan metrik bisnis lebih lanjut, Rakuten 24 juga menjalankan pengujian A/B yang berfokus pada pengoptimalan Data Web Inti dan metrik terkait, serta mengalami peningkatan:
- 53,37% dalam pendapatan per pengunjung.
- Rasio konversi sebesar 33,13%.
- 15,20% dalam nilai pesanan rata-rata.
- 9,99% dalam waktu rata-rata yang dihabiskan.
- Penurunan rasio keluar sebesar 35,12%.
Menyoroti peluang
Meskipun mengoptimalkan performa web adalah investasi cerdas untuk meningkatkan pengalaman pengguna dan pertumbuhan bisnis, tim Rakuten 24 memahami betapa sulitnya meyakinkan pemangku kepentingan untuk mengadopsi Data Web Inti dan berfokus pada performa web. Mereka percaya bahwa menunjukkan kepada pemangku kepentingan dengan tepat jenis pengoptimalan performa Laba atas Investasi (ROI) yang dapat dihadirkan adalah cara terbaik untuk membuat mereka setuju.
Sebagai layanan yang relatif baru dan independen, Rakuten 24 memanfaatkan fleksibilitas mereka untuk menghadapi tantangan tersebut. Mereka percaya bahwa hasil studi kasus akan membantu mereka membuat keputusan yang lebih berorientasi data di masa mendatang, serta membantu developer lain mengukur dampak pekerjaan mereka dan meyakinkan pemangku kepentingan bahwa peningkatan performa sepadan dengan investasi. Cari tahu cara mereka melakukannya dalam postingan ini.
Mengoptimalkan JavaScript dan resource
- Hilangkan resource yang memblokir render.
- Pisahkan kode dan gunakan
import()
dinamis. - Bagi semua konten menjadi bagian terpisah dan muat file HTML paruh bawah secara lambat.
- Menjalankan dan memuat JavaScript sesuai permintaan.
- Identifikasi resource JavaScript yang lambat dan optimalkan proses pemuatan dengan menggunakan atribut asinkron pada tag
<script>
dan membuat koneksi awal ke asal yang penting (Petunjuk resource sepertidns-prefetch
,preconnect
, danpreload
). - Hapus kode yang tidak digunakan, lalu minifikasi dan kompresi kode.
- Gunakan CDN.
- Kontrol caching menggunakan Service Worker dengan Workbox.
Mengoptimalkan gambar
- Pemuatan lambat gambar paruh bawah.
- Optimalkan gambar dengan CDN, kirimkan gambar dengan ukuran yang tepat, kompresi gambar, dan gunakan format gambar yang tepat untuk tugas tersebut (WebP, SVG, Font Web).
Mengoptimalkan CLS
- Gunakan CSS
aspect-ratio
untuk mencadangkan ruang yang diperlukan untuk gambar saat gambar dimuat. - Gunakan CSS
min-height
untuk meminimalkan pergeseran tata letak saat elemen dimuat dengan lambat.
Pengukuran performa
Selain menggunakan PageSpeed Insights untuk mengaudit situs mereka, tim ingin menemukan cara yang lebih baik untuk mengetahui apa yang sebenarnya dialami pengguna di lapangan. Oleh karena itu, Rakuten 24 memutuskan untuk menggunakan library JavaScript web-vitals untuk mengukur Data Web Inti dan metrik lainnya di lapangan dan mengirimkan data ke alat analisis internal.
Menganalisis performa
Tim menganalisis data lapangan yang dikumpulkan untuk menentukan apakah ada korelasi antara Data Web Inti dan metrik bisnis utama. Mereka mendapati bahwa pengguna yang melakukan konversi cenderung memiliki LCP yang lebih baik daripada pengguna yang tidak melakukan konversi.
Data yang dikumpulkan juga mengungkapkan bahwa:
- LCP yang baik dapat menghasilkan peningkatan rasio konversi hingga 61,13%, pendapatan per pengunjung sebesar 26,09%, dan nilai pesanan rata-rata sebesar 11,26%.
- FID yang baik dapat menghasilkan peningkatan rasio konversi hingga 55,88% dibandingkan dengan data rata-rata keseluruhan.
Pemantauan performa
Tim membangun dasbor pemantauan performa menggunakan data yang dikumpulkan di lapangan dan alat business intelligence. Hal ini penting untuk memantau progres dan mencegah regresi.
Pengujian A/B
Karena yakin bahwa pengujian A/B adalah cara yang baik untuk mengukur dampak bisnis dari pengoptimalan performa, tim mengoptimalkan salah satu halaman landing untuk Core Web Vitals, lalu membandingkan versi yang dioptimalkan dengan halaman aslinya melalui pengujian A/B selama satu bulan. Mereka memilih halaman landing dengan traffic dan konversi yang signifikan agar pengujian dapat mencapai hasil yang berarti. Selama durasi pengujian, 50% traffic dikirim ke halaman landing yang dioptimalkan (versi A), dan 50% dikirim ke halaman orisinal (versi B). Satu-satunya perbedaan antara versi A dan versi B adalah versi A dioptimalkan untuk Core Web Vitals dan tidak ada perbedaan fungsional atau visual lainnya.
Versi A yang dioptimalkan selesai memuat 0,4 detik lebih awal dalam uji beban seluler dan tidak menunjukkan pergeseran tata letak yang signifikan. Bahkan, CLS versi A meningkat sebesar 92,72% dibandingkan dengan versi B. Skor Data Web lainnya juga meningkat: FID meningkat sebesar 7,95%, FCP meningkat sebesar 8,45%, dan TTFB meningkat sebesar 18,03%.
Membandingkan versi A yang dioptimalkan dengan versi B yang tidak dioptimalkan, Rakuten 24 menemukan bahwa versi A menghadirkan:
- Peningkatan pendapatan per pengunjung sebesar 53,37%.
- Peningkatan rasio konversi sebesar 33,13%.
- Peningkatan nilai pesanan rata-rata sebesar 15,20%.
- Peningkatan rata-rata waktu yang dihabiskan sebesar 9,99%.
- penurunan rasio keluar sebesar 35,12%.
Kesimpulan
Pengoptimalan performa web memang menantang, tetapi bermanfaat. Dengan mengambil pendekatan berbasis data, Rakuten 24 telah berhasil menghadirkan pengalaman pengguna yang lebih baik serta mengukur dampak positif pada bisnis mereka. Memahami bahwa ini hanyalah bagian dari perjalanan, bukan tujuan, mereka akan terus meningkatkan kualitas situs untuk memberikan pengalaman yang lebih menyenangkan kepada pembeli online.
Pengoptimalan memerlukan upaya bersama dan developer tidak harus sendirian dalam perjalanan ini. Dengan membagikan perjuangan dan pencapaian mereka, Rakuten 24 berharap lebih banyak developer dapat menggunakan data Core Web Vitals untuk mengembangkan pemahaman bersama dengan para pemangku kepentingan, lalu bekerja sama untuk mewujudkan pengalaman pengguna dan pertumbuhan bisnis berkualitas tinggi.