Cronômetro online
Cronômetro online gratuito com precisão de milissegundos e cronometragem por voltas
O que é um Cronômetro Online?
Um cronômetro online é uma ferramenta de cronometragem de precisão que mede o tempo decorrido a partir de zero, normalmente com resolução de milissegundos. Diferente de um temporizador de contagem regressiva, um cronômetro responde "quanto tempo isso levou?", tornando-o ideal para treinamento esportivo, experimentos de laboratório, apresentações, culinária, sprints de programação e qualquer atividade onde você precisa rastrear a duração. Esta ferramenta funciona completamente no seu navegador usando requestAnimationFrame para atualizações suaves de exibição e performance.now() para medição de tempo monotônica, mantendo-se precisa mesmo quando o relógio do sistema é ajustado. O registro de voltas permite capturar tempos parciais com destaque da melhor/pior volta, e todos os dados permanecem locais — nada é enviado.
Como usar
Início rápido
- Clique em 'Iniciar' para começar — a tela mostra horas:minutos:segundos.milissegundos
- Clique em 'Volta' durante a execução para registrar um tempo parcial
- Clique em 'Pausar' para congelar a tela, depois 'Iniciar' para retomar
- Clique em 'Redefinir' para limpar o cronômetro e todos os registros de voltas
Dicas
- O cronômetro usa requestAnimationFrame para atualizações de ~16ms e performance.now() para tempo preciso.
- Mantenha a aba visível para a exibição mais suave. Abas em segundo plano podem limitar os quadros de animação.
- Tempos de volta são codificados por cor: verde para a volta mais rápida, vermelho para a mais lenta.
Casos de uso
Princípio técnico
O motor do cronômetro evita completamente o padrão setInterval propenso a deriva. Em vez disso, ele usa requestAnimationFrame (rAF) para atualizações de exibição e performance.now() como fonte de tempo de referência. Quando o usuário clica em Iniciar, o motor registra o timestamp performance.now() atual como startTime. A cada quadro de animação, ele calcula elapsed = accumulated + (performance.now() - startTime), onde accumulated mantém o tempo total decorrido antes da pausa mais recente. Este modelo de duas variáveis (tempo acumulado + delta de execução) lida corretamente com ciclos de pausa/retomada sem perda de precisão sub-milissegundo. performance.now() é escolhido em vez de Date.now() porque é monotônico — nunca retrocede devido a correções NTP, alterações manuais do relógio ou transições de horário de verão. Ele também oferece resolução sub-milissegundo (tipicamente granularidade de 5 µs em navegadores modernos), tornando-o o relógio certo para cronometragem de curta duração e alta precisão. O callback rAF é limitado à taxa de atualização da tela (tipicamente 60 Hz = ~16,67 ms, até 120 Hz em telas de alta taxa de atualização), então a atualização visual é suave, mas não é a a referência — o tempo real decorrido vem do cálculo performance.now(), que é continuamente correto. O registro de voltas captura o elapsedMs atual no momento em que o botão Volta é clicado, calculando a diferença parcial em relação ao total da volta anterior. As voltas mais rápidas e mais lentas são determinadas comparando todas as diferenças de volta com Math.min/Math.max, e a tela as destaca com estilos verde e vermelho respectivamente. Todo o estado reside em hooks useState do React dentro do componente cliente, e nenhum dado é persistido ou transmitido — o cronômetro é efêmero por natureza, redefinindo-se completamente quando a página é fechada ou o botão Redefinir é pressionado.
- performance.now() fornece timestamps monotônicos de precisão sub-milissegundo — imune a alterações do relógio do sistema.
- requestAnimationFrame impulsiona atualizações de exibição na taxa de atualização (60–120 Hz) para renderização suave.
- O modelo de tempo acumulado + delta de execução lida com pausa/retomada sem perda de precisão.
- Diferenças de volta são calculadas como currentTotal - previousTotal para cronometragem parcial precisa.
- Todo o cálculo é executado localmente no navegador; sem idas e vindas ao servidor ou uploads de dados.
Exemplos
Pista de atletismo — voltas de 400m
Volta 1 -> 01:12.450 (+01:12.450)
Volta 2 -> 02:26.180 (+01:13.730)
Volta 3 -> 03:38.910 (+01:12.730)
Volta 4 -> 04:50.320 (+01:11.410 mais rápida)Ensaio de apresentação — cronometragem por slide
Introdução -> 00:45.200 (+00:45.200)
Problema -> 02:10.850 (+01:25.650)
Solução -> 04:35.120 (+02:24.270)
Demo -> 07:10.430 (+02:35.310)
Conclusão -> 08:25.610 (+01:15.180)
Total: 8 min 25 seg — abaixo da meta de 10 minTreino HIIT — rastreamento de intervalos
Rodada 1 -> 00:30.150 (+00:30.150)
Descanso 1 -> 00:45.320 (+00:15.170)
Rodada 2 -> 01:15.480 (+00:30.160)
Descanso 2 -> 01:30.510 (+00:15.030)
Rodada 3 -> 02:00.670 (+00:30.160 mais lenta)
Rodada 4 -> 02:30.520 (+00:29.850 mais rápida)Perguntas frequentes
Quão preciso é o cronômetro?
O cronômetro usa performance.now() que oferece precisão sub-milissegundo (tipicamente granularidade de 5 microssegundos). A tela é atualizada cerca de 60 vezes por segundo via requestAnimationFrame, então a atualização visual fica dentro de 16ms do valor real. Para a maioria dos propósitos práticos — esportes, culinária, apresentações — isso é mais que suficiente.
O cronômetro continua funcionando se eu mudar de aba?
Sim. O tempo decorrido é calculado a partir do timestamp performance.now() absoluto, não de ticks cumulativos. Ao voltar para a aba, a tela mostra imediatamente o tempo decorrido correto. No entanto, requestAnimationFrame é limitado em abas de segundo plano, então a atualização visual pode pausar até você retornar.
O que acontece se meu computador entrar em suspensão?
performance.now() é monotônico, mas não avança enquanto o sistema está suspenso. Quando o computador acordar, a tela do cronômetro mostrará o tempo decorrido como se o sistema nunca tivesse dormido — NÃO incluirá a duração da suspensão. Este é o comportamento correto para a maioria dos casos de uso de cronometragem.
Posso exportar ou salvar meus tempos de volta?
O cronômetro atualmente não suporta salvar ou exportar dados de voltas. Todos os registros de voltas são mantidos em memória e limpos ao redefinir o cronômetro ou fechar a página. Para registro persistente, copie manualmente os tempos exibidos ou use um rastreador de fitness dedicado.
Por que usar performance.now() em vez de Date.now()?
performance.now() é monotônico — nunca retrocede. Date.now() pode pular segundos ou minutos quando o relógio do sistema é ajustado (sincronização NTP, alteração manual, horário de verão). Para cronometragem de curta duração, performance.now() é a escolha correta. Ele também oferece resolução sub-milissegundo, diferente da resolução de milissegundos do Date.now().
Algum dado é enviado para um servidor?
Não. O cronômetro funciona completamente no seu navegador. Nenhum dado de cronometragem, registro de voltas ou informação de uso é enviado para qualquer servidor. A página funciona offline após carregada.
Qual é a diferença entre um cronômetro e um temporizador de contagem regressiva?
Um cronômetro mede o tempo decorrido para cima a partir de zero — ele responde "quanto tempo levou?". Um temporizador de contagem regressiva começa de uma duração definida e conta regressivamente até zero — ele responde "quanto tempo resta?". Esta ferramenta é um cronômetro; para funcionalidade de contagem regressiva, use a ferramenta Timer de Contagem Regressiva.