Saltar al contenido principal

Temporizadores que funcionan en una pestaña en segundo plano (y por qué algunos no)

3 min de lectura
Temporizadores que funcionan en una pestaña en segundo plano (y por qué algunos no)
Foto de ian dooley / Unsplash

El problema de la limitación de recursos

Los navegadores ahorran energía limitando el JavaScript de las pestañas en segundo plano, y cada navegador traza la línea de forma distinta. Los fotogramas de animación se detienen casi al instante, así que cualquier temporizador basado en un bucle visual se desvía o se congela. Los temporizadores basados en la hora del sistema, donde la cuenta atrás se calcula a partir de la hora real actual en lugar de segundos contados, mantienen el tiempo con precisión aunque la pestaña esté limitada, porque el navegador aún los despierta periódicamente para comprobarlos.

Lo que sobrevive en segundo plano

Los temporizadores basados en setInterval se limitan a más o menos una vez por segundo, o peor, en pestañas en segundo plano, pero siguen disparándose, y por eso un temporizador bien construido sigue funcionando y solo sufre la animación suave de las cifras. Los avisos de audio son el otro riesgo: algunos navegadores bloquean el sonido en pestañas de segundo plano no visitadas, salvo que la pestaña haya tenido interacción del usuario. Una página de temporizador que has hecho clic para iniciar ya ha interactuado, así que su alarma sonará; un temporizador que se inicia solo no tendrá tanta suerte.

Las notificaciones como respaldo

Los temporizadores de navegador más robustos disparan a la vez una alarma en la página y una notificación del sistema, de modo que el aviso te llega aunque la ventana del navegador esté minimizada o estés en otra aplicación. El permiso de notificaciones se pide en el primer uso. Para cuentas atrás largas (una hora o más, como una reunión o un ciclo de lavado) eso importa más que la precisión; para intervalos cortos (cocina, rondas de ejercicio) el alarma sonora hace el trabajo y la notificación es solo comodidad.

Por qué los móviles dan resultados dispares

Los navegadores móviles limitan más las pestañas en segundo plano que los de escritorio, y algunos bloquean la pantalla por completo, lo que puede pausar o matar un temporizador web. Un temporizador web funciona bien en un móvil cuando la pantalla sigue encendida y la pestaña es visible; es la herramienta equivocada para cronometrar un móvil en el bolsillo. En los escenarios de bolsillo gana una app nativa o un temporizador físico. Sé en qué escenario estás antes de confiar en cualquier cuenta atrás.

Pon a prueba tu temporizador una vez

Pon cualquier temporizador nuevo a 1 minuto, cambia de pestaña y espera. Si la alarma suena en unos segundos del minuto, el temporizador sobrevive a la limitación y puedes fiarte de él. Si suena tarde o no suena, has aprendido en dos minutos lo que de otro modo aprenderías mientras te desbordaba la pasta. Nuestro temporizador supera esta prueba en navegadores de escritorio y avisa desde una pestaña en segundo plano, y eso es exactamente por lo que lo construimos.

Herramientas

Nuestro temporizador en línea gratuito está basado en la hora del sistema y suena audiblemente desde una pestaña en segundo plano en escritorio. Pruébalo una vez con el truco del minuto de arriba, sube el volumen y tendrás una cuenta atrás que se comporta como un electrodoméstico, no como una página web.