Mengukur aplikasi web satu halaman

Dokumen ini ditujukan bagi developer yang ingin mengukur tayangan halaman di aplikasi halaman tunggal menggunakan Google Analytics.

Aplikasi web satu halaman (SPA) adalah situs yang memuat dokumen HTML satu kali dan mengambil konten tambahan menggunakan JavaScript API.

Contoh: Misalkan Anda memiliki formulir untuk mendapatkan beberapa prospek. Formulir memiliki tiga layar:

• Layar pertama untuk mendapatkan informasi pelanggan.
• Layar kedua tempat pelanggan menunjukkan minat pada layanan tertentu.
• Halaman ketiga untuk mendaftar ke webinar yang terkait dengan minat pelanggan.

Kunci untuk mengukur tayangan halaman dari SPA dengan benar adalah menghitung tayangan halaman untuk setiap layar yang berinteraksi dengan pengguna dan mendapatkan perujuk halaman yang tepat, sehingga Anda dapat melacak perjalanan pengguna dengan benar.

Sebelum memulai

Halaman ini mengasumsikan bahwa Anda sudah memiliki:

• Akun dan properti Google Analytics 4 untuk situs Anda. Pelajari cara Menyiapkan Google Analytics.

• Tag Google yang diterapkan di situs Anda yang diaktifkan saat halaman dimuat pertama kali. Pelajari cara Menyiapkan tag Google.

Menerapkan pengukuran aplikasi web satu halaman

Untuk menerapkan pengukuran SPA yang akurat, gunakan salah satu metode berikut untuk memicu tayangan halaman virtual baru:

• Perubahan histori browser (direkomendasikan): Jika SPA Anda menggunakan History API, khususnya metode pushState() dan replaceState() untuk memperbarui layar, gunakan opsi ini.

• Peristiwa kustom: Jika situs Anda menggunakan objek DocumentFragment untuk merender layar yang berbeda, gunakan opsi ini.

Penerapan histori browser Penerapan peristiwa kustom

Penerapan perubahan histori browser

Jika SPA Anda menggunakan History API, Anda dapat mengaktifkan pengukuran yang disempurnakan di Google Analytics untuk melacak tampilan halaman secara otomatis berdasarkan peristiwa histori browser.

Mengaktifkan pengukuran yang ditingkatkan di GA4

Untuk mengukur page_views secara otomatis berdasarkan histori browser:

1. Buka Google Analytics

2. Di Admin, pada bagian Pengumpulan dan perubahan data, klik Aliran Data > Web.

3. Di bagian Pengukuran yang disempurnakan, geser tombol ke posisi Aktif untuk mengaktifkan semua opsi.

4. Klik untuk mengedit opsi satu per satu. Di bagian Tampilan Halaman, klik Tampilkan setelan lanjutan. Pastikan untuk mengaktifkan Pemuatan halaman dan Perubahan halaman berdasarkan peristiwa histori penjelajahan.

   

5. Simpan perubahan.

Memverifikasi penyiapan pengukuran Anda

Untuk memverifikasi bahwa aplikasi web satu halaman Anda mengukur tayangan halaman dengan benar:

1. Aktifkan mode debug untuk setiap tag dalam penyiapan pengukuran SPA Anda. Pelajari cara Memantau peristiwa di DebugView.

2. Klik aplikasi web satu halaman Anda. Saat mengklik layar virtual baru, Anda akan melihat peristiwa page_view baru di DebugView. Bandingkan parameter peristiwa page_view dengan peristiwa page_view sebelumnya untuk memeriksa apakah perujuk halaman dan lokasi halaman telah diperbarui dengan benar.

Dampak pada peristiwa otomatis

Jika Anda menerapkan pengukuran tayangan halaman virtual dengan benar di SPA, maka Google Analytics akan menangani peristiwa otomatis lainnya dengan tepat. Jika tayangan halaman virtual tidak dicatat untuk perubahan layar, Google Analytics memperlakukan SPA sebagai satu halaman, sehingga menyebabkan metrik yang tidak akurat.

Misalnya, peristiwa user_engagement mengukur waktu yang dihabiskan pengguna secara aktif di halaman. Tanpa tayangan halaman virtual, semua waktu engagement dikaitkan dengan pemuatan halaman awal, sehingga tidak mungkin menganalisis waktu yang dihabiskan di setiap layar.

Jika pengukuran tayangan halaman virtual diterapkan dengan benar:

• Peristiwa user_engagement dikirim saat pengguna berpindah dari satu halaman virtual ke halaman virtual lainnya.
• Waktu engagement untuk halaman virtual sebelumnya dihitung dan dikirim bersama dengan peristiwa user_engagement, biasanya tepat sebelum peristiwa page_view untuk halaman virtual baru diproses.
• Peristiwa lain, seperti klik atau scroll, dikaitkan dengan page_location halaman virtual yang sedang dilihat pengguna.

Dengan begitu, Anda dapat menganalisis engagement pengguna dan metrik lainnya untuk setiap layar atau bagian dalam SPA, sehingga memberikan pemahaman yang lebih akurat tentang perjalanan pengguna.