Countdown-timer
Stel uren, minuten en seconden in, start het aftellen en hoor een duidelijk alarmgeluid als het nul bereikt — werkt zelfs in een achtergrondtabblad.
1.046 weergaven
Hoe de countdown nauwkeurig blijft
Een countdown die bij elke keer dat setInterval afgaat gewoon één seconde van een lopend totaal aftrekt, klinkt eenvoudig, maar is over tijd niet nauwkeurig. Elke tick gaat ervan uit dat er precies 1000 milliseconden zijn verstreken, terwijl de event loop van de browser druk bezig kan zijn — andere scripts, animaties, of een achtergrondtabblad — waardoor ticks een paar milliseconden te laat afgaan. Die kleine vertragingen stapelen zich op tot zichtbare afwijking: een op deze manier gebouwde timer van 10 minuten kan bij het bereiken van nul enkele seconden te vroeg of te laat klaar zijn.
Dit hulpmiddel vermijdt dat probleem met een andere methode: het berekent op het moment dat u op start drukt een vaste doel-tijdstempel — de huidige tijd plus de gekozen duur — en vraagt bij elke tick simpelweg hoeveel tijd er nog rest tot dat doel, in plaats van af te tellen vanaf een lopend totaal. Omdat de resterende tijd altijd opnieuw wordt berekend uit twee echte klokmetingen, heft elke opgebouwde tickvertraging zichzelf automatisch op; de weergegeven tijd blijft correct, ook wanneer individuele ticks te laat afgaan.
Wat u moet weten
Wanneer het tabblad dat u aan het timen bent op de achtergrond staat, beperken browsers timers vaak om batterij en processorvermogen te sparen, en laten ze deze minder vaak afgaan dan gevraagd. De doel-tijdstempel-aanpak handelt ook dit sierlijk af: het maakt niet uit hoeveel ticks er zijn overgeslagen, want de countdown vergelijkt bij de volgende uitvoering nog steeds de echte doeltijd met de echte huidige tijd — hij bereikt nul op het juiste moment, ongeacht hoe sterk het tabblad ondertussen werd afgeremd.
- Het alarmgeluid wordt ter plekke gegenereerd met de oscillator-node van de Web Audio API — er hoeft geen audiobestand te laden, dus er is geen vertraging voordat het klinkt.
- De titel van het browsertabblad werkt bij met de resterende tijd, zodat u naar een ander tabblad kunt kijken en de countdown toch kunt zien.
- Pauzeren bewaart de resterende duur en berekent bij hervatten een nieuwe doel-tijdstempel, zodat ook pauzeren en hervatten nooit afwijking veroorzaken.
Veelgestelde vragen
Hoor ik het alarm als ik in een ander tabblad zit?
Ja — het alarmgeluid speelt vanuit dit tabblad af, ongeacht welk tabblad actief is, zolang het browsertabblad zelf geopend blijft (niet gesloten wordt).
Pauzeert de countdown als mijn laptop in slaap valt?
Hij pauzeert samen met het systeem, zoals elke browsertimer — wanneer u het apparaat wekt en de doeltijd al is verstreken, toont hij direct nul en alarmeert onmiddellijk.
Kan ik ook uren instellen, niet alleen minuten?
Ja — uren, minuten en seconden zijn allemaal beschikbaar, dus het werkt voor alles van een zoemer van 10 seconden tot een aftellen van meerdere uren.
Waarom blijft de timer nauwkeurig bij lange looptijden?
Omdat hij nooit individuele ticks optelt. Hij berekent bij het indrukken van start één vaste doel-tijdstempel en herberekent bij elke tick "doel min nu", zodat een vertraging in één enkele tick geen effect heeft op het eindresultaat — de timer bereikt nog steeds nul op precies het juiste moment.
Gooit vertraging in een achtergrondtabblad de countdown in de war?
Nee. Browsers vertragen timers in inactieve tabbladen om energie te sparen, waardoor ticks minder vaak kunnen afgaan, maar omdat elke tick de resterende tijd herberekent vanuit de echte doel-tijdstempel in plaats van verstreken ticks te tellen, bereikt de countdown toch nul op het juiste, werkelijke moment.
Vergelijkbare tools
Probleem melden
Countdown-timer
Reacties
Nog geen reacties — schrijf de eerste!