Suponga que se está reproduciendo un video en una página HTML5 usando la etiqueta <video> . ¿Cómo puedo medir la velocidad de fotogramas real? No solo quiero leer la velocidad de fotogramas del archivo de video ( por ejemplo , sino lo que el navegador puede administrar en la práctica).
(Supongo que será posible piratear algo que involucre requestAnimationFrame , pero me preocupa vagamente que en algunos sistemas, la reproducción de video se desvincule del resto de la página, lo que generará un resultado incorrecto; además, espero que pueda haber un métrica más directa.)
Podría intentar explorar VideoPlaybackQuality , tal vez las métricas que proporciona puedan serle útiles.
Más específicamente, los fotogramas perdidos o los fotogramas totales presentaron valores.
¿Tal vez involucrando esos resultados junto con otras opciones como requestAnimationFrame ?
No estoy seguro de cuál es el objetivo final exacto de su proyecto. Por ejemplo , "¿Cómo puedo medir la velocidad de fotogramas real?" Personalmente puedo interpretar eso como:
(1) Velocidad del decodificador de video por cuadro (para el tipo de video dado).
Por ejemplo, la velocidad de decodificación de cada cuadro individual a 720p frente a una resolución de 4K.
(2) Número de fotogramas perdidos por segundo .
Donde resta el número de FPS contra los fotogramas eliminados para saber cuántos se presentaron.
Aquí hay un ejemplo rápido/básico de uso de VideoPlaybackQuality :
<!DOCTYPE html> <html> <body> <video id="myvid" width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> </video> <br><br> <text id="mytxt"> </text> </body> <script> var mytxt = document.getElementById("mytxt"); var myvid = document.getElementById("myvid"); var fps = 30; //# use real FPS of input video var vid_data; //# an Object for VideoPlaybackQuality var myInterval; //# to check Quaity statistics every second var vidPaused = false; myvid.addEventListener('play', onVidEvents); myvid.addEventListener('pause', onVidEvents); myvid.addEventListener('ended', onVidEvents); function onVidEvents() { if (event.type == "play") { vidPaused = false; myInterval = setInterval(check_framesQuality, 1000); } if (event.type == "seeked") { vid_data = myvid.getVideoPlaybackQuality(); update_text(); } if (event.type == "pause") { vidPaused = true; clearInterval(myInterval); } if (event.type == "ended") { clearInterval(myInterval); vidPaused = true;} } function check_framesQuality() { if( vidPaused == false ) { vid_data = myvid.getVideoPlaybackQuality(); update_text(); } } function update_text() { mytxt.innerText = "Total Decoded Frames : " + vid_data.totalVideoFrames + "\n" + "Dropped Frames : " + vid_data.droppedVideoFrames + "\n" + "====================" + "\n" + "Video Time (secs) : " + Math.round( myvid.currentTime ) + "\n" + "Expected Frames : " + Math.round( fps * myvid.currentTime ) //# received frames == ( expectedFrames - DroppedFrames ) + "\n" + "Received Frames : " + ( Math.round( fps * myvid.currentTime) - vid_data.droppedVideoFrames) } </script> </html>