Temporizador de Contagem Regressiva
Defina horas, minutos e segundos, inicie a contagem regressiva e ouça um alarme claro ao chegar a zero — funciona até em uma aba em segundo plano.
1.055 visualizações
Como a Contagem Regressiva Se Mantém Precisa
Uma contagem regressiva que simplesmente subtrai um segundo de um total a cada disparo do setInterval parece simples, mas não é precisa ao longo do tempo. Cada "tick" assume que exatamente 1000 milissegundos se passaram, mas o loop de eventos do navegador pode estar ocupado — outros scripts, animações ou uma aba em segundo plano — e os ticks disparam com alguns milissegundos de atraso. Esses pequenos atrasos se acumulam em um desvio visível: um temporizador de 10 minutos construído assim pode terminar vários segundos antes ou depois do esperado ao chegar a zero.
Esta ferramenta evita esse problema com um método diferente: ela calcula um timestamp-alvo fixo no momento em que você aperta iniciar — a hora atual mais a duração escolhida — e a cada tick simplesmente pergunta quanto tempo falta até esse alvo, em vez de contar para baixo a partir de um total acumulado. Como o tempo restante é sempre recalculado a partir de duas leituras reais do relógio, qualquer atraso acumulado de tick se cancela automaticamente; o tempo exibido permanece correto mesmo quando ticks individuais disparam atrasados.
O Que Você Deveria Saber
Quando a aba que você está cronometrando fica em segundo plano, os navegadores costumam limitar os temporizadores para economizar bateria e CPU, disparando-os com menos frequência do que o solicitado. A abordagem do timestamp-alvo lida com isso com naturalidade também: não importa quantos ticks foram pulados, porque a contagem regressiva continua comparando o horário-alvo real com o horário atual real na próxima vez que roda — ela chega a zero no momento correto independentemente de quão limitada a aba estava nesse meio-tempo.
- O som de alerta é gerado na hora com o nó oscilador da Web Audio API — nenhum arquivo de áudio precisa carregar, então não há atraso antes de ele tocar.
- O título da aba do navegador é atualizado com o tempo restante, então você pode olhar para outra aba e ainda ver a contagem regressiva.
- Pausar guarda a duração restante e recalcula um novo timestamp-alvo ao retomar, então pausar e retomar também nunca introduzem desvio.
Perguntas Frequentes
Vou ouvir o alarme se estiver em outra aba?
Sim — o som de alerta toca a partir desta aba, não importa qual esteja em foco, desde que a aba do navegador continue aberta (não fechada).
A contagem regressiva pausa se meu notebook dormir?
Ela pausa junto com o sistema, como qualquer temporizador de navegador — ao acordar o dispositivo, se o horário-alvo já passou, mostrará zero e alertará imediatamente.
Posso definir horas, não só minutos?
Sim — horas, minutos e segundos estão todos disponíveis, então funciona desde um alarme de 10 segundos até uma contagem regressiva de várias horas.
Por que o temporizador se mantém preciso em durações longas?
Porque ele nunca soma ticks individuais. Ele calcula um único timestamp-alvo fixo quando você aperta iniciar e recalcula "alvo menos agora" a cada tick, então um atraso em qualquer tick específico não tem efeito no resultado final — o temporizador ainda chega a zero no momento exatamente certo.
A limitação de uma aba em segundo plano atrapalha a contagem regressiva?
Não. Os navegadores desaceleram temporizadores em abas inativas para economizar energia, então os ticks podem disparar com menos frequência, mas como cada tick recalcula o tempo restante a partir do timestamp-alvo real em vez de contar ticks decorridos, a contagem regressiva ainda chega a zero no momento real correto.
Ferramentas Semelhantes
Reportar um Problema
Temporizador de Contagem Regressiva
Comentários
Ainda não há comentários — seja o primeiro a escrever um!