Membuat Dasar Pengukuran dapat ditindaklanjuti dengan data pengguna sebenarnya

Karlijn Löwik

Erwin Hofman

Dipublikasikan: 10 Februari 2025

Pernah menunda penerapan fitur web modern karena tidak yakin apakah browser pengguna akan mendukungnya? Atau menyimpan polyfill berat lebih lama dari yang diperlukan? Anda tidak sendirian. Meskipun Baseline memberi kita sinyal yang jelas tentang dukungan browser global, ada bagian yang hilang: mengetahui apa yang sebenarnya didukung oleh pengguna Anda.

Tim RUMvision mengatasi hal ini dengan menggabungkan data Dasar Pengukuran dengan data pemantauan pengguna sebenarnya (RUM), dan hasilnya sangat menarik. Tim mendapati bahwa mereka dapat mengadopsi fitur modern beberapa bulan lebih awal dari yang direncanakan, dan beberapa tim mendapati bahwa mereka mempertahankan polyfill yang bahkan tidak diperlukan oleh 97% pengguna mereka. Kreator lain menemukan bahwa sebaiknya mereka menunda penerapan fitur baru karena audiens mereka belum siap.

Dasbor RUMvision yang menampilkan jumlah pengunjung yang mendukung Dasar Pengukuran. — Dasbor Dasar Pengukuran RUMvision utama, berdasarkan data pada Desember 2024, menunjukkan dukungan fitur Dasar Pengukuran secara keseluruhan di seluruh pengguna Anda, yang diatur berdasarkan tahun pengenalan.

Cara kerja Dasar Pengukuran dan dukungan browser

Dukungan untuk fitur web terikat dengan versi browser: saat browser merilis fitur, pengguna mendapatkannya dengan mengupdate browser. Dasar pengukuran melacak kapan semua browser utama (Chrome, Edge, Firefox, dan Safari) telah mengirimkan fitur, menandainya dengan badge biru, dan menyetelnya ke "Baru tersedia". Setelah 30 bulan, status ini akan diperbarui menjadi "Tersedia secara luas".

Namun, pola update pengguna Anda mungkin terlihat sangat berbeda dengan rata-rata global. Dengan melacak versi browser sebenarnya yang dimiliki pengguna, RUMvision dapat menunjukkan persentase audiens yang mendukung setiap fitur secara akurat. Tindakan ini mengubah Baseline dari indikator umum menjadi alat praktis untuk situasi tertentu Anda.

Penggunaan browser di seluruh web

Dengan melihat jutaan kunjungan halaman di berbagai pasar (Desember 2024), RUMvision menemukan pola yang jelas tentang cara pengguna mendapatkan update browser:

Update Chrome, Edge, dan Firefox diadopsi dengan cepat, sering kali mencapai dukungan 95% dalam waktu sekitar tiga bulan.
Safari memerlukan waktu yang jauh lebih lama—sekitar 19 bulan untuk mencapai tingkat yang sama karena terikat dengan update sistem operasi
Chrome memiliki keunikannya sendiri—Chrome mencapai 95-98% dengan cepat, tetapi kemudian melambat, memerlukan waktu hingga 23 bulan untuk mencapai 99%.

Meskipun Dasar Pengukuran melacak ratusan fitur, Anda mungkin berfokus pada fitur tertentu yang ingin digunakan. Waktu tunggu untuk fitur apa pun bergantung pada browser yang terakhir mendukungnya.

Jika Chrome adalah browser terakhir yang diperlukan agar fitur dapat mencapai Dasar Pengukuran, dan audiens Anda sebagian besar menggunakan Chrome, mereka kemungkinan akan memilikinya dalam beberapa bulan. Namun, jika Safari adalah browser terakhir yang menambahkan dukungan, meskipun setiap browser lain sudah siap beberapa tahun yang lalu, Anda mungkin harus menunggu 19 bulan agar pengguna Safari mendapatkan update sistem operasi yang diperlukan.

Dunia nyata terlihat berbeda bagi setiap orang

Data kami menunjukkan perbedaan dukungan yang cukup besar di berbagai situs (Desember 2024):

Retailer perlengkapan rumah Belanda:
- Fitur dasar pengukuran 2024: Dukungan 34%
- Fitur dasar pengukuran 2023: Dukungan 76%
- Fitur yang tersedia secara luas: Dukungan 95%
Blog teknologi yang berbasis di AS:
- Fitur dasar pengukuran 2024: Dukungan 59%
- Fitur Dasar Pengukuran 2023: Dukungan 89%
- Fitur yang tersedia secara luas: Dukungan 100%
Situs properti Timur Tengah:
- Fitur dasar pengukuran 2024: Dukungan 39%
- Fitur dasar pengukuran 2023: dukungan 74%
- Fitur yang tersedia secara luas: Dukungan 95%

Perbedaan ini terjadi karena siapa pengunjung Anda dan cara mereka menjelajahi situs:

Pengguna yang paham teknologi cenderung melakukan update dengan cepat, sementara audiens umum sering kali menggunakan versi sebelumnya.
Kelompok usia dan audiens yang berbeda memiliki kebiasaan dan perangkat penjelajahan yang berbeda.
Cara pengguna seluler dan desktop mengakses situs Anda berbeda-beda.
Beberapa wilayah lebih memilih iOS, sementara wilayah lainnya lebih memilih Android, yang memengaruhi kapan fitur tersedia.

Itulah sebabnya fitur yang sama mungkin dapat digunakan dengan aman di blog teknologi dalam beberapa bulan, tetapi memerlukan penggantian di situs e-commerce selama setahun lagi.

Mengintegrasikan Dasar Pengukuran ke RUMvision

Tim RUMvision ingin memastikan bahwa integrasinya sesuai dengan ekspektasi developer, dan bagaimana mereka ingin melihat informasi ini ditampilkan.

Mereka mendekatinya dari dua perspektif:

Sebagai developer sendiri yang perlu mengetahui informasi ini.
Sebagai kreator yang membangun untuk komunitas pengembangan yang lebih luas.

Seperti banyak developer, tim ini secara rutin menggunakan alat seperti Can I Use dan tabel dukungan MDN, sehingga mereka menyesuaikan integrasi untuk menyajikan informasi dengan cara yang akan meningkatkan alur kerja mereka sendiri sekaligus memenuhi kebutuhan semua pengguna RUMvision.

Menggabungkan beberapa sumber data

Proses ini dimulai dengan mengimpor secara otomatis data fitur web yang baru dirilis. Fitur ini kemudian ditampilkan dalam listingan yang dapat ditelusuri dan difilter untuk pengguna RUMvision.

Saat fitur web diklik, modal akan terbuka yang menampilkan informasi Dasar Pengukuran mendetail dan linimasa dukungan browser. Tampilan ini dilengkapi dengan insight tambahan:

Referensi: Link ke halaman MDN, Can I Use, W3C, informasi rilis browser, Status Chrome, dan artikel web.dev.
Linimasa adopsi dasar pengukuran: Menampilkan kapan setiap browser menerapkan dukungan untuk suatu fitur.
Tabel dukungan MDN: Data dari browser-compat-data yang menampilkan informasi mendetail yang mirip dengan tabel dukungan standar MDN.
Bug yang diketahui: Diekstrak dari set data yang sama untuk melengkapi resource yang tersedia.
Bantuan AI: Membantu menafsirkan statistik dukungan di seluruh browser utama.

Dokumentasi untuk data visibilitas konten dan dukungan browser untuk Popover seperti yang ditampilkan di RUMVision. — Screenshot ini menampilkan dokumentasi dan informasi dukungan yang disediakan secara gratis tentang semua fitur yang ada dalam set Dasar Pengukuran.

Memaksimalkan fitur modern

Kekuatan sebenarnya dari menggabungkan Dasar Pengukuran dengan data pengguna juga terkait dengan kemajuan fitur web modern. Untuk setiap fitur, Anda akan melihat tingkat adopsi audiens dan dapat melacak perubahannya dari waktu ke waktu. Artinya, Anda harus mengganti solusi JavaScript yang kompleks dengan kemampuan browser native pada saat yang tepat. Misalnya, Anda dapat berpindah dari:

Komponen responsif berbasis JavaScript untuk kueri penampung.
Library pemuatan lambat JavaScript bergantung pada IntersectionObserver API untuk pemuatan lambat native.
Framework dengan modal yang di-bake (misalnya, Bootstrap) ke dalam Popover API.

Daripada menunggu 30 bulan untuk status "Tersedia secara luas", Anda dapat membuat keputusan yang tepat berdasarkan data penggunaan yang sebenarnya. Anda akan mengetahui dengan tepat kapan harus merilis fitur baru dan cara menerapkannya secara efektif.

Contoh nyata, dampak nyata

Untuk contoh yang berhasil, lihat fitur yang baru-baru ini mencapai Dasar Pengukuran, properti content-visibility CSS:

Beberapa situs memiliki dukungan 99%, siap untuk segera diterapkan.
Yang lainnya menunjukkan dukungan 82-89%, yang menunjukkan perlunya penggantian.
Beberapa segmen pengguna tertentu yang diidentifikasi masih menggunakan browser lama.

Linimasa dukungan browser. — Linimasa `content-visibility` untuk situs teknologi di Amerika Serikat dibandingkan situs agen properti di Timur Tengah.

Data juga menunjukkan bahwa dari Februari 2024 hingga September 2024, dukungan di Safari untuk keduanya tetap sekitar 20%, yang berkorelasi dengan IOS 18 yang di-deploy mulai September 2024, yang mengirimkan fitur ini.

Keberhasilan pelanggan dengan Dasar Pengukuran "Tersedia secara luas" mereka sendiri

Dengan menggunakan insight dari informasi RUM Anda sendiri, Anda dapat membuat Dasar Pengukuran Anda sendiri, yang mencakup fitur yang tersedia untuk situs Anda dalam empat status dan kemampuan untuk memfilternya:

Siap dikirim (jika didukung oleh setidaknya 98% pengunjung Anda).
Terlihat bagus (mendukung cakupan antara 95% hingga 98%).
Peringatan (cakupan antara 75% dan 95%).
Lanjutkan dengan hati-hati (cakupan kurang dari 75%).

Informasi tentang visibilitas konten

Dengan menggabungkan data RUM dengan informasi Dasar Pengukuran per fitur web, pengguna telah melihat kisah sukses. Informatiebord.nl menghapus polyfill JavaScript sebesar 30 KB setelah menemukan bahwa 97% penggunanya sudah mendukung fitur native. Developernya, Kevin Meijer, mengatakan:

"Dengan Baseline, kami dapat memutuskan secara strategis: apakah kami berfokus untuk memberikan pengalaman pengguna yang sempurna bagi 97% pengunjung tanpa mengorbankan performa, atau apakah kami memperlambat inovasi untuk mengakomodasi 3% sisanya? Kami secara sadar memilih opsi pertama, karena upaya tambahan untuk 3% tersebut akan berdampak negatif pada pengalaman mayoritas."

Pesan yang menyatakan bahwa 96,9% pengunjung mendukung kanvas offscreen. — Kisah sukses pelanggan, dengan informasibord.nl yang dengan percaya diri menghapus polyfill dari situs berdasarkan data pengguna sebenarnya.

Berkontribusi pada web

Data dasar pengukuran yang dikombinasikan dengan insight pengguna sebenarnya membantu kita semua membuat keputusan yang lebih baik tentang dukungan fitur. Kapan harus menghapus kode lama, kapan harus mengadopsi fitur baru—pilihan ini menjadi lebih jelas jika Anda mengetahui apa yang sebenarnya didukung pengguna.

RUMvision membagikan temuan tentang pola adopsi browser kepada Grup Komunitas WebDX, yang membantu menginformasikan cara fitur berpindah dari status "Baru tersedia" ke "Tersedia secara luas".