SetTimeout El método de no enfriarse cuando el navegador entra en segundo plano

En aras del ahorro de energía, algunos navegadores pausarán tareas cronometradas como setTimeout al entrar en segundo plano (o cuando pierdan el foco). Cuando el
usuario regrese al navegador, las tareas cronometradas se reactivarán. Se
dice que están en pausa, de hecho , debe decirse que está retrasado, la tarea de 1 s se retrasa a 2 s, 2 s se retrasa a 5 s, la situación real varía con los navegadores

Ejecuta el código en Chrome

var t = new Date() * 1

function fun1() {
    
    
	var _t = new Date() * 1
	console.log(_t - t)
	t = _t
	setTimeout(fun1, 1000)
}
fun1()

La consola imprimirá un resultado similar.

Verde significa que el intervalo entre cada ejecución de la tarea es de aproximadamente 1000 ms durante el trabajo normal.
Rojo significa que el intervalo entre cada ejecución de la tarea es de aproximadamente 2000 ms cuando el navegador entra en segundo plano.

Este es el rendimiento del ahorro de energía del navegador.
A veces es una función que no es importante. Si está en pausa o retrasada,
no importa. Pero cuando no queremos que se detenga, ¿cómo podemos hacer que setTimeout funcione? ¿adecuadamente?

Solución

var c3 = document.createElement("audio")
c3.src = "https://www.runoob.com/try/demo_source/horse.mp3"
c3.volume = 0
// 有些浏览器很严格, 需要设一个极小的音量, 或换一个没有声音的音频文件
c3.loop = true;
c3.play();

var t = new Date() * 1

function fun1() {
    
    
	var _t = new Date() * 1
	console.log(_t - t)
	t = _t
	setTimeout(fun1, 1000)
}
// fun1()

Los amigos que han visto videos en la web saben que si minimizas la ventana o activas otras páginas, el archivo multimedia no dejará de reproducirse.
El principio de este método es reproducir el contenido multimedia, para que el navegador piense que la ventana no ha entrado. el fondo y, por lo tanto, no establece el tiempo de espera. Fuera de suspensión

Desventajas

Pero este método también tiene limitaciones

Solo funciona en el lado de la PC
. Este método no es necesariamente efectivo en el lado móvil.

Para reproducir un archivo multimedia, debe haber un comportamiento del usuario,
es decir, si el código ejecuta fun1 (), será inválido y debe ser llamado con un evento como click.

Por lo tanto, no es un último recurso y no se recomienda este método.

fin