카운트다운 타이머

온라인 카운트다운 타이머는 브라우저에서 무료로 쓸 수 있는 도구로, 설정한 시간부터 0까지 카운트다운한 뒤 알림을 줍니다. 뽀모도로 25분, 달걀 삶기 6분, 시험 45분까지, 시간 제한이 필요한 모든 상황에 쓸 수 있어요. 시계를 계속 보는 대신 타이머를 켜두면 시간에서 벗어나 일에만 집중할 수 있고, 카운트다운이 끝나면 알람이 다시 현실로 돌려놓습니다. 다운로드도, 회원가입도, 업로드도 없습니다. 모든 동작은 브라우저 탭 안에서만 이뤄집니다.

이 카운트다운 타이머는 setInterval로 초를 세는 방식을 쓰지 않습니다. 그 방식은 브라우저 이벤트 루프가 최소 지연만 보장할 뿐 일정한 간격을 유지하지 못해 시간이 지날수록 오차가 누적되기 때문입니다. 대신 Date.now()로 시작 시각을 기록하고 매 프레임마다 남은 시간을 다시 계산합니다: 남은 시간 = 목표 시간 − (Date.now() − 시작 시각). 이 자기 보정 설계 덕분에 JavaScript 스레드가 가비지 컬렉션이나 레이아웃 작업으로 잠시 바빠져도 표시 시간은 정확하게 유지됩니다.

화면 갱신은 requestAnimationFrame으로 구동되며, 모니터 주사율(보통 초당 60회, 고주사율 디스플레이는 120회)에 맞춰 부드럽게 렌더링됩니다. 실제 시간 측정은 Date.now() 계산이 담당하고, 애니메이션은 표시용일 뿐 측정 수단이 아닙니다.

탭이 백그라운드로 가면 브라우저는 타이머를 공격적으로 스로틀링합니다. 숨겨진 탭의 setInterval은 초당 1회 호출로 제한될 수 있고, 배터리 사용 시에는 몇 분 후 비활성 탭이 완전히 동결되기도 합니다. 이 타이머는 탭이 다시 보이는 순간 시스템 시계를 확인해 표시를 정확한 남은 시간으로 즉시 맞춥니다. 종료 알람에는 Web Audio API로 짧은 신호음을 재생합니다. 브라우저 자동재생 정책에 따라 오디오 재생 전에 사용자 동작(시작 버튼 클릭 등)이 한 번 필요합니다. 탭이 숨겨져 있거나 시스템이 절전 상태면 알람은 울리지 않지만, 돌아오는 즉시 정확한 경과 시간이 표시됩니다.

• Date.now()로 벽시계 수준의 정확도를 구현 - setInterval 틱을 세는 대신 매 프레임 남은 시간을 재계산합니다.
• requestAnimationFrame이 디스플레이 갱신을 화면 주사율에 동기화해 부드럽게 렌더링합니다.
• 백그라운드 탭은 브라우저에 의해 스로틀링되며, 돌아오면 시스템 시계로 표시를 보정합니다.
• Web Audio API로 알람을 재생하며, 오디오 허용 전에 사용자 동작(시작 클릭 등)이 필요합니다.
• 모든 연산은 브라우저에서 로컬로 처리되며 어떤 데이터도 외부로 전송되지 않습니다.