Cek Fokus Jendela
Cek Fokus Jendela menunjukkan secara real-time apakah jendela browser Anda mendapat fokus, kehilangan fokus ke aplikasi lain, atau tabnya sedang tersembunyi. Alat ini membaca event focus dan blur dari browser bersama Page Visibility API untuk melaporkan gambaran yang akurat, momen demi momen, tentang bagaimana jendela Anda digunakan.
Alat ini dibuat untuk developer yang menulis kode yang peka terhadap fokus dan visibility — menjeda video, menahan polling, menghentikan animasi, atau menyimpan state saat tab keluar dari layar — dan untuk siapa saja yang sekadar ingin mengukur seberapa sering mereka berpindah dari sebuah halaman.
Daripada menebak-nebak cara kerja focus, blur, dan visibilitychange, Anda dapat melihat event-nya berjalan langsung, melihat nilai persis yang dilaporkan browser, dan meninjau riwayat berstempel waktu dari setiap perubahan.
Cara Memakai Cek Fokus Jendela
Mulai di status Fokus
Buka alat ini dan lihat banner status besar. Banner dimulai di status Fokus, artinya jendela ini mendapat fokus dan sedang terlihat.
Klik jendela lain
Klik aplikasi lain sambil tetap menampilkan tab ini di layar. Banner berubah menjadi Tidak fokus — jendela kehilangan fokus, tetapi tabnya masih terlihat.
Pindah tab atau minimalkan
Pindah ke tab browser lain atau minimalkan jendela. Banner berubah menjadi Tersembunyi karena tabnya sendiri tidak lagi terlihat.
Perhatikan statistik dan log
Kembali ke tab ini untuk melihat status kembali ke Fokus dan entri baru muncul di log event. Kartu statistik diperbarui secara langsung: waktu fokus, waktu pergi, kali kehilangan fokus, pindah tab, dan rentetan fokus terlama.
Pembacaan mentah di bawah kartu menampilkan nilai persis dari document.hasFocus() dan document.visibilityState di setiap momen. Gunakan Hapus untuk mengosongkan log event, atau Atur ulang untuk menolkan setiap penghitung dan memulai sesi pengukuran yang benar-benar baru.
Fitur
Deteksi Tiga Status
Melacak Fokus, Tidak fokus (jendela blur), dan Tersembunyi (tab tidak terlihat), diturunkan dari document.hasFocus() dan document.visibilityState apa pun urutan event yang berjalan.
Timer Fokus & Pergi Langsung
Total waktu fokus dan total waktu pergi diperbarui terus-menerus, bersama timer untuk status saat ini dan satu timer untuk keseluruhan sesi.
Penghitung Terpisah
Berapa kali jendela kehilangan fokus dan jumlah perpindahan tab dihitung terpisah, sehingga mengeklik jendela lain dibedakan dari berpindah tab.
Rentetan Fokus Terlama
Mencatat periode fokus terlama tanpa terputus dan memperbaruinya secara langsung seiring rentetan saat ini bertambah.
Pembacaan Mentah API
Menampilkan boolean langsung yang dikembalikan document.hasFocus() dan string yang dikembalikan document.visibilityState.
Log Event Berstempel Waktu
Setiap perubahan status dicatat dengan yang terbaru di atas, lengkap dengan stempel waktu dan durasi status sebelumnya, menyimpan 100 event terakhir.
Penghitungan Waktu Anti-Throttle
Waktu dihitung dari stempel waktu, bukan dari penghitung berjalan, sehingga throttling timer di latar belakang tidak mengganggu totalnya.
Kontrol Hapus & Atur Ulang
Hapus mengosongkan log event, sedangkan Atur ulang menolkan setiap penghitung dan timer untuk memulai sesi pengukuran baru.
Mode Gelap
Tema gelap bawaan menjaga banner status, statistik, dan log tetap terbaca pada pengaturan minim cahaya.
Pertanyaan yang Sering Diajukan
Bagaimana cara cek apakah jendela browser sedang fokus?
Buka alat ini dan baca banner statusnya. Saat jendela mendapat fokus keyboard dan terlihat, banner menampilkan Fokus dan pembacaan mentah melaporkan document.hasFocus() sebagai true. Klik jendela lain atau pindah tab untuk melihat status dan nilainya berubah seketika.
Apa beda antara "Tidak fokus" dan "Tersembunyi"?
Tidak fokus berarti jendela kehilangan fokus — misalnya Anda mengeklik aplikasi lain — tetapi tabnya masih terlihat di layar. Tersembunyi berarti tabnya sendiri tidak lagi terlihat, seperti saat Anda pindah ke tab lain atau meminimalkan browser.
Apa beda antara document.hasFocus() dan visibilitychange?
document.hasFocus() memberi tahu apakah jendela saat ini mendapat fokus input, sedangkan visibilitychange berjalan saat document.visibilityState tab berpindah antara visible dan hidden. Sebuah jendela bisa terlihat tetapi tidak fokus (Anda mengeklik aplikasi lain), jadi alat ini menggabungkan kedua sinyal untuk melaporkan satu status yang andal.
Bagaimana mendeteksi saat pengguna pindah tab?
Pantau event visibilitychange dan periksa document.hidden. Saat tab tersembunyi, pengguna telah berpindah atau meminimalkan; saat kembali, document.hidden menjadi false lagi. Alat ini mendemonstrasikan alur tersebut secara langsung dan menaikkan penghitung pindah tab terpisah setiap kali tab menjadi tersembunyi.
Kenapa event blur berjalan padahal halaman masih terlihat?
Event blur melacak fokus input, bukan visibility. Mengeklik jendela lain atau membuka developer tools memindahkan fokus keyboard, sehingga blur berjalan dan document.hasFocus() mengembalikan false meskipun halaman masih ada di layar. Alat ini melaporkannya dengan akurat sebagai status Tidak fokus.
Kenapa terkadang muncul dua entri log untuk satu kali pindah tab?
Beberapa browser menjalankan blur sebelum perubahan visibility. Dalam kasus itu jendela menjadi Tidak fokus dulu lalu Tersembunyi, sehingga kedua transisi tercatat. Penghitungnya tetap naik dengan benar — sekali untuk meninggalkan fokus dan sekali untuk tab menjadi tersembunyi.
Apakah timer tetap akurat saat tab berada di latar belakang?
Ya. Waktu dihitung dari stempel waktu, bukan dari penghitung berjalan, sehingga throttling latar belakang yang diterapkan browser pada timer tidak memengaruhi totalnya.
Apakah alat ini menyimpan data saya setelah halaman ditutup?
Tidak. Setiap kunjungan memulai sesi baru, semuanya berjalan lokal di browser Anda, dan tidak ada yang disimpan atau dikirim ke mana pun.
Belum ada komentar. Jadilah yang pertama berkomentar!