Bagaimana investasi Rakuten 24 dalam Core Web Vitals meningkatkan pendapatan per pengunjung sebesar 53,37% dan rasio konversi sebesar 33,13%

Dengan mengukur Data Web pengguna yang sebenarnya, Rakuten 24 juga menemukan bahwa Largest Contentful Paint (LCP) yang baik dapat meningkatkan rasio konversi sebesar 61,13%.

Hayoung Lee

Linh Duong

Ryunosuke Akiba

Shogo Kashiwase

Rakuten 24 adalah toko online yang berkolaborasi dengan produsen barang konsumen multinasional dan domestik terkemuka untuk menawarkan berbagai kebutuhan sehari-hari termasuk produk 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 toko berperforma terbaik di platform marketplace digital mereka di Jepang.

Dengan memahami dampak performa web terhadap pengalaman pengguna, tim Rakuten 24 telah terus mengukur, mengoptimalkan, dan memantau Core Web Vitals serta metrik lainnya.

Hasilnya, lebih dari 75% pengguna mereka mengalami Largest Contentful Paint (LCP), Penundaan Input Pertama (FID), dan First Contentful Paint (FCP) yang baik. Namun, mereka masih berupaya meningkatkan Cumulative Layout Shift (CLS).

Setelah menganalisis data halaman beranda, Rakuten 24 menemukan bahwa skor LCP yang baik dapat menghasilkan:

Peningkatan rasio konversi hingga 61,13%.
26,09% pendapatan per pengunjung.
11,26% dalam nilai pesanan rata-rata.
Skor FID yang baik dapat meningkatkan rasio konversi hingga 55,88%.

Untuk lebih mengorelasi Core Web Vitals dan metrik bisnis, Rakuten 24 juga menjalankan pengujian A/B yang berfokus pada pengoptimalan Core Web Vitals dan metrik terkait, serta melihat peningkatan:

53,37% pendapatan per pengunjung.
33,13% dalam rasio konversi.
15,20% dalam nilai pesanan rata-rata.
9,99% dalam waktu kunjungan rata-rata.
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 Core Web Vitals dan berfokus pada performa web. Mereka yakin bahwa cara terbaik untuk mendapatkan dukungan dari pemangku kepentingan adalah dengan menunjukkan jenis Laba atas Investasi (ROI) yang dapat dihasilkan oleh pengoptimalan performa.

Sebagai layanan yang relatif baru dan independen, Rakuten 24 menggunakan keunggulan fleksibilitasnya untuk menghadapi tantangan tersebut. Mereka yakin bahwa hasil studi kasus mereka akan membantu mereka membuat lebih banyak keputusan yang berorientasi pada data di masa mendatang, serta membantu developer lain mengukur dampak pekerjaan mereka dan meyakinkan pemangku kepentingan bahwa meningkatkan performa sepadan dengan investasinya. Cari tahu caranya dalam postingan ini.

Contoh screenshot halaman beranda Rakuten 24, dengan bingkai perangkat seluler di sekitar setiap screenshot. — Beberapa contoh screenshot halaman beranda Rakuten 24.

Mengoptimalkan JavaScript dan resource

Menghilangkan resource yang memblokir rendering.
Pisahkan kode dan gunakan import() dinamis.
Membagi semua konten menjadi bagian terpisah dan memuat lambat file HTML di bawah lipatan.
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 origin penting (Petunjuk resource seperti dns-prefetch, preconnect, dan preload).
Hapus kode yang tidak digunakan, serta minifikasi dan kompresi kode.
Gunakan CDN.
Kontrol penyimpanan dalam cache menggunakan Pekerja Layanan dengan Workbox.

Mengoptimalkan gambar

Pemuatan lambat untuk gambar paruh bawah.
Optimalkan gambar dengan CDN, kirimkan gambar dengan ukuran yang tepat, kompresi gambar, dan gunakan format gambar yang tepat untuk tugas (WebP, SVG, Web Fonts).

Mengoptimalkan CLS

Gunakan CSS aspect-ratio untuk mencadangkan ruang yang diperlukan untuk gambar saat gambar dimuat.
Gunakan min-height CSS untuk meminimalkan pergeseran tata letak saat elemen dimuat lambat.

Pengukuran performa

Selain menggunakan PageSpeed Insights untuk mengaudit situs mereka, tim ingin menemukan cara yang lebih baik untuk mengetahui pengalaman 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 serta mengirim data ke alat analisis internal.

Alur integrasi pelacakan data web Rakuten 24. Langkah pertama adalah mengintegrasikan library web-vitals dengan menambahkan skrip ke situs Rakuten 24. Setelah itu, vital web dapat diukur dari metrik pengguna yang sebenarnya, dan data tersebut dikirim ke alat pengumpulan data internal Rakuten 24.

Analisis 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 mengalami LCP yang lebih baik daripada pengguna yang tidak melakukan konversi.

Perbandingan pengguna yang melakukan konversi dengan yang tidak melakukan konversi berdasarkan LCP. Kelompok pengguna yang lebih sering berkonversi mengalami LCP yang lebih rendah.

Data yang dikumpulkan juga mengungkapkan bahwa:

LCP yang baik dapat meningkatkan rasio konversi hingga 61,13%, pendapatan per pengunjung sebesar 26,09%, dan nilai pesanan rata-rata sebesar 11,26%.
FID yang baik dapat meningkatkan rasio konversi hingga 55,88% dibandingkan dengan data rata-rata secara keseluruhan.

LCP dikelompokkan menurut rasio konversi dan waktu LCP. Pengguna yang melakukan konversi lebih sering melakukan konversi saat LCP lebih rendah, dengan 61,13% pengguna melakukan konversi dengan LCP satu detik atau lebih rendah. — Dampak LCP terhadap rasio konversi.

LCP dikelompokkan berdasarkan pendapatan per pengunjung dan waktu LCP. Pengguna dengan LCP yang lebih rendah memberikan lebih banyak pendapatan, dengan peningkatan pendapatan sebesar 26,09% per pengguna jika LCP adalah satu detik atau lebih rendah. — Dampak LCP terhadap pendapatan per pengunjung.

LCP dikelompokkan berdasarkan nilai pesanan rata-rata dan waktu LCP. Pengguna dengan LCP yang lebih rendah memiliki nilai pesanan rata-rata 11,26% lebih tinggi jika LCP adalah satu detik atau lebih rendah. — Dampak LCP terhadap nilai pesanan rata-rata.

FID dikelompokkan berdasarkan rasio konversi dan waktu FID. Pengguna yang lebih sering melakukan konversi melakukannya saat FID lebih rendah, dengan 55,88% pengguna melakukan konversi dengan FID 50 milidetik atau lebih rendah. — Dampak FID terhadap rasio konversi.

Pemantauan Performa

Tim membuat 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 ini mengoptimalkan salah satu halaman landing mereka untuk Core Web Vitals, lalu membandingkan versi yang dioptimalkan dengan halaman asli melalui pengujian A/B selama sebulan. Mereka memilih halaman landing dengan traffic dan konversi yang signifikan sehingga pengujian dapat mencapai hasil yang berarti. Selama durasi pengujian, 50% traffic dikirim ke halaman landing yang dioptimalkan (versi A), dan 50% dikirim ke halaman asli (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 dimuat 0,4 detik lebih awal dalam pengujian pemuatan seluler dan tidak menunjukkan pergeseran tata letak yang signifikan. Faktanya, 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%.

Perbandingan startup halaman beranda Rakuten 24. Versi A dioptimalkan untuk pemuatan yang lebih baik, yang dimuat dalam waktu 1,6 detik, dibandingkan dengan Versi B, yang dimuat dalam waktu 2 detik. — Hasil pengujian beban seluler versi A dan versi B.

Dengan membandingkan versi A yang dioptimalkan dengan versi B yang tidak dioptimalkan, Rakuten 24 menemukan bahwa versi A menghasilkan:

Peningkatan pendapatan per pengunjung sebesar 53,37%.
Peningkatan rasio konversi sebesar 33,13%.
Peningkatan nilai pesanan rata-rata sebesar 15,20%.
Peningkatan waktu yang dihabiskan rata-rata sebesar 9,99%.
Penurunan rasio keluar sebesar 35,12%.

Screenshot peningkatan Core Web Vitals untuk halaman beranda Rakuten 24. Statistiknya adalah peningkatan pendapatan per pengunjung sebesar 53,37%, peningkatan rasio konversi sebesar 33,13%, peningkatan nilai pesanan rata-rata sebesar 15,2%, peningkatan waktu rata-rata yang dihabiskan di halaman sebesar 9,99%, dan penurunan rasio keluar sebesar 35,12%.

Kesimpulan

Mengoptimalkan performa web memang menantang, tetapi hasilnya sangat memuaskan. Dengan menggunakan pendekatan berbasis data, Rakuten 24 berhasil memberikan pengalaman pengguna yang lebih baik serta dampak positif yang terukur pada bisnis mereka. Dengan 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 Data Web Inti untuk mengembangkan pemahaman bersama dengan pemangku kepentingan, lalu bekerja sama untuk mencapai pengalaman pengguna yang berkualitas tinggi dan pertumbuhan bisnis.