Pada sebuah website yang menggunakan player Plyr.io, patcher video NetMeter Web tiba-tiba tidak berfungsi sama sekali saat video menggunakan native HTML5. Awalnya, saya mengira ada bug kecil, namun hasil trace menunjukkan hal yang lebih menarik. Video tersebut memuat sumber .php, namun Chrome diam-diam mengikuti redirect ke .mp4 tanpa mengubah DOM yang tetap menampilkan .php. Perbedaan kecil ini mengungkap “penyimpangan besar” dalam perilaku browser modern.
Ketika saya membuka DevTools, terlihat bahwa .php berubah menjadi .mp4 melalui status code 302, tetapi DOM tidak menampilkan perubahan tersebut. Redirect untuk media diproses di luar jangkauan JavaScript, yaitu di network stack, sesuai spesifikasi HTML5. Browser hanya menampilkan apa yang tercantum dalam DOM, bukan apa yang sebenarnya terjadi di belakang layar.
Saya menemukan bahwa Same-Origin Policy & CORS serta operasi internal browser saat mengikuti 302 redirect menjadi alasan bagi informasi tersebut disembunyikan dari script. Masalah lain terjadi pada GPU Decoder di Chrome, dimana tidak semua video diproses melalui software decoder, menyebabkan properti seperti webkitVideoDecodedByteCount dan webkitAudioDecodedByteCount tetap nol.
Saya sempat mencoba beberapa solusi untuk mengatasi masalah ini, namun tidak ada yang memberikan hasil stabil. Meskipun begitu, menunggu request media selesai dengan status 206 Partial Content bisa memberikan gambaran bandwidth yang lebih stabil pada kasus redirect media yang sulit dipantau oleh JavaScript.
Kesimpulannya, redirect media memiliki aturan yang lebih ketat daripada request biasa, dan GPU decoding membuat statistik video tidak dapat diakses oleh JavaScript. Meskipun solusi tidak sepenuhnya akurat, memahami cara browser bekerja dari lapisan bawah sangat penting. Terima kasih!
