Ikhtisar
Saat menyediakan fungsi yang berbeda tergantung pada browser atau lingkungan perangkat, User-Agent Sniffing dan Feature Detection adalah dua pendekatan yang paling umum.
Belakangan ini, Feature Detection lebih disarankan dari sisi kemudahan pemeliharaan dan keamanan.
1. User-Agent Sniffing
Ini adalah metode untuk mengidentifikasi perangkat atau browser dengan menganalisis string User-Agent.
Berguna untuk mengidentifikasi model perangkat, tetapi sensitif terhadap pembaruan, dan penggunaannya makin dibatasi seiring penguatan kebijakan perlindungan privasi.
navigator.userAgentData.getHighEntropyValues(['model', 'platform'])
2. Feature Detection
Ini adalah metode percabangan kondisi dengan memeriksa apakah sebuah fitur didukung atau tidak.
Dapat diterapkan dengan aman dan fleksibel tanpa bergantung pada jenis browser atau perangkat.
if ('fetch' in window) {
// menggunakan fetch API
}
3. Library: Modernizr & Sniffr
Modernizr adalah library yang memudahkan Feature Detection, dan bisa dibangun hanya dengan fitur yang diinginkan.
Sniffr adalah library yang memudahkan parsing informasi berbasis User-Agent.
4. Kemungkinan deteksi per platform
- Android memungkinkan ekstraksi hingga nama model (seperti SM-xxxx)
- iOS memungkinkan pembedaan iPhone/iPad, tetapi identifikasi model terbatas
- Mac/Windows memungkinkan pemeriksaan hingga versi OS, tetapi sulit untuk mengidentifikasi perangkat
5. Informasi lain yang dapat dideteksi
- Jumlah core CPU:
navigator.hardwareConcurrency - Kapasitas memori:
navigator.deviceMemory - Kecepatan jaringan:
navigator.connection.effectiveType
6. Contoh pendekatan campuran
Dengan menggabungkan User-Agent dan Feature Detection, deteksi lingkungan yang lebih presisi juga dimungkinkan.
Contoh: mendeteksi model dengan notch, apakah menggunakan Apple Silicon, dan apakah suatu fitur didukung
environment.supportsServiceWorker = 'serviceWorker' in navigator;
7. Menyikapi masa depan: Privacy Sandbox dan User-Agent Reduction
Google sedang mengurangi string User-Agent, dan sebagai respons terhadap hal ini, penggunaan User-Agent Client Hints API disarankan.
API ini menyediakan informasi pengguna dengan cara yang lebih terstruktur dan lebih ramah privasi.
navigator.userAgentData.getHighEntropyValues(['platform', 'model']);
Kesimpulan
- Secara default, utamakan Feature Detection
- Minimalkan deteksi berbasis User-Agent, dan jika diperlukan gunakan teknologi (API) terbaru
- Untuk menghadapi standar masa depan, sebaiknya siapkan juga pendekatan baru seperti Client Hints.
Belum ada komentar.