Online-Stoppuhr
Kostenlose Online-Stoppuhr mit Millisekunden-Präzision und Rundenzeitmessung
Was ist eine Online-Stoppuhr?
Eine Online-Stoppuhr ist ein präzises Zeitmesswerkzeug, das die verstrichene Zeit von null aufwärts misst, typischerweise mit Millisekunden-Auflösung. Anders als ein Countdown-Timer, der auf eine Frist zusteuert, beantwortet eine Stoppuhr die Frage "Wie lange hat das gedauert?" — ideal für Sporttraining, Laborexperimente, Präsentationen, Kochen, Coding-Sprints und jede Aktivität, bei der du die Dauer verfolgen möchtest. Dieses Tool läuft vollständig in deinem Browser und verwendet requestAnimationFrame für flüssige Anzeige-Updates und performance.now() für monotone Zeitmessung, sodass es auch bei Systemzeit-Anpassungen genau bleibt. Die Rundenaufzeichnung erfasst Zwischenzeiten mit Hervorhebung der schnellsten/langsamsten Runde, und alle Daten bleiben lokal — nichts wird hochgeladen.
Verwendung
Schnellstart
- Klicken auf 'Start' zum Beginnen — die Anzeige zeigt Stunden:Minuten:Sekunden.Millisekunden
- Klicken auf 'Runde' während des Laufs, um eine Zwischenzeit aufzuzeichnen
- Klicken auf 'Pause' zum Einfrieren der Anzeige, dann 'Start' zum Fortsetzen
- Klicken auf 'Zurücksetzen', um den Timer und alle Rundenaufzeichnungen zu löschen
Tipps
- Die Stoppuhr verwendet requestAnimationFrame für ~16ms Bildschirmaktualisierungen und performance.now() für genaue Zeitmessung.
- Lassen den Tab sichtbar für die flüssigste Anzeige. Hintergrund-Tabs können Animations-Frames drosseln.
- Rundenzeiten sind farbcodiert: Grün für die schnellste Runde, Rot für die langsamste.
Anwendungsfälle
Technisches Prinzip
Die Stoppuhr-Engine vermeidet vollständig das driftanfällige setInterval-Muster. Stattdessen verwendet sie requestAnimationFrame (rAF) für Bildschirmaktualisierungen und performance.now() als autoritative Zeitquelle. Wenn der Benutzer auf Start klickt, zeichnet die Engine den aktuellen performance.now()-Zeitstempel als startTime auf. In jedem Animations-Frame berechnet sie elapsed = accumulated + (performance.now() - startTime), wobei accumulated die gesamte verstrichene Zeit vor der letzten Pause enthält. Dieses Zwei-Variablen-Modell (akkumulierte Zeit + Laufzeit-Delta) behandelt Pause/Fortsetzen-Zyklen korrekt ohne Präzisionsverlust im Sub-Millisekunden-Bereich. performance.now() wird gegenüber Date.now() bevorzugt, da es monoton ist — es springt nie aufgrund von NTP-Korrekturen, manuellen Uhrzeitanpassungen oder Sommerzeitumstellungen zurück. Es bietet auch Sub-Millisekunden-Auflösung (typischerweise 5 µs Granularität in modernen Browsern) und ist damit die richtige Uhr für kurze, hochpräzise Zeitmessung. Der rAF-Callback wird auf die Bildwiederholrate des Displays begrenzt (typischerweise 60 Hz = ~16,67 ms, bis zu 120 Hz bei High-Refresh-Displays), sodass die visuelle Aktualisierung flüssig ist, aber nicht der maßgebliche Wert — die tatsächliche verstrichene Zeit stammt aus der performance.now()-Berechnung, die kontinuierlich korrekt ist. Die Rundenaufzeichnung erfasst die aktuelle elapsedMs in dem Moment, in dem die Runden-Taste geklickt wird, und berechnet die Split-Differenz zur Gesamtzeit der vorherigen Runde. Die schnellsten und langsamsten Runden werden durch Vergleich aller Runden-Differenzen mit Math.min/Math.max bestimmt und grün bzw. rot hervorgehoben. Der gesamte Zustand lebt in React useState-Hooks innerhalb der Client-Komponente, und keine Daten werden persistiert oder übertragen — die Stoppuhr ist von Natur aus flüchtig und wird beim Schließen der Seite oder Drücken der Zurücksetzen-Taste vollständig zurückgesetzt.
- performance.now() liefert monotone, sub-millisekunden Zeitstempel — immun gegen Systemzeit-Änderungen.
- requestAnimationFrame treibt Bildschirmaktualisierungen mit der Bildwiederholrate (60–120 Hz) für flüssiges Rendering an.
- Das Modell aus akkumulierter Zeit + Laufzeit-Delta behandelt Pause/Fortsetzen ohne Präzisionsverlust.
- Runden-Differenzen werden als currentTotal - previousTotal für präzise Split-Zeitmessung berechnet.
- Alle Berechnungen laufen lokal im Browser; keine Server-Roundtrips oder Daten-Uploads.
Beispiele
Laufbahn — 400m Runden-Splits
Runde 1 -> 01:12.450 (+01:12.450)
Runde 2 -> 02:26.180 (+01:13.730)
Runde 3 -> 03:38.910 (+01:12.730)
Runde 4 -> 04:50.320 (+01:11.410 schnellste)Präsentationsprobe — Folien-Zeitmessung
Intro -> 00:45.200 (+00:45.200)
Problem -> 02:10.850 (+01:25.650)
Lösung -> 04:35.120 (+02:24.270)
Demo -> 07:10.430 (+02:35.310)
Fazit -> 08:25.610 (+01:15.180)
Gesamt: 8 Min 25 Sek — unter dem 10-Min-ZielHIIT-Training — Intervallverfolgung
Runde 1 -> 00:30.150 (+00:30.150)
Pause 1 -> 00:45.320 (+00:15.170)
Runde 2 -> 01:15.480 (+00:30.160)
Pause 2 -> 01:30.510 (+00:15.030)
Runde 3 -> 02:00.670 (+00:30.160 langsamste)
Runde 4 -> 02:30.520 (+00:29.850 schnellste)Häufig gestellte Fragen
Wie genau ist die Stoppuhr?
Die Stoppuhr verwendet performance.now(), das Sub-Millisekunden-Präzision bietet (typischerweise 5 Mikrosekunden Granularität). Die Anzeige aktualisiert sich etwa 60 Mal pro Sekunde über requestAnimationFrame, sodass die visuelle Aktualisierung innerhalb von 16ms des tatsächlichen Werts liegt. Für die meisten praktischen Zwecke — Sport, Kochen, Präsentationen — ist das mehr als ausreichend.
Läuft die Stoppuhr weiter, wenn ich den Tab wechsle?
Ja. Die verstrichene Zeit wird aus dem absoluten performance.now()-Zeitstempel berechnet, nicht aus kumulativen Ticks. Wenn du zum Tab zurückkehrst, zeigt die Anzeige sofort die korrekte verstrichene Zeit. Allerdings wird requestAnimationFrame in Hintergrund-Tabs gedrosselt, sodass die visuelle Aktualisierung pausieren kann, bis du zurückkehrst.
Was passiert, wenn mein Computer in den Ruhezustand geht?
performance.now() ist monoton, schreitet aber nicht fort, während das System suspendiert ist. Wenn der Computer aufwacht, zeigt die Stoppuhr die verstrichene Zeit an, als ob das System nie geschlafen hätte — die Schlafdauer wird NICHT eingeschlossen. Dies ist das korrekte Verhalten für die meisten Zeitmessungs-Anwendungsfälle.
Kann ich meine Rundenzeiten exportieren oder speichern?
Die Stoppuhr unterstützt derzeit kein Speichern oder Exportieren von Rundendaten. Alle Rundenaufzeichnungen werden im Arbeitsspeicher gehalten und beim Zurücksetzen des Timers oder Schließen der Seite gelöscht. Für dauerhafte Aufzeichnungen kopiere die angezeigten Zeiten manuell oder verwende einen dedizierten Fitness-Tracker.
Warum performance.now() anstelle von Date.now() verwenden?
performance.now() ist monoton — es geht nie rückwärts. Date.now() kann um Sekunden oder Minuten springen, wenn die Systemuhr angepasst wird (NTP-Synchronisation, manuelle Änderung, Sommerzeit). Für Kurzzeitmessungen ist performance.now() die richtige Wahl. Es bietet auch Sub-Millisekunden-Auflösung, im Gegensatz zur Millisekunden-Auflösung von Date.now().
Werden Daten auf einen Server hochgeladen?
Nein. Die Stoppuhr läuft vollständig in deinem Browser. Keine Zeitmessdaten, Rundenaufzeichnungen oder Nutzungsinformationen werden an einen Server gesendet. Die Seite funktioniert nach dem Laden auch offline.
Was ist der Unterschied zwischen einer Stoppuhr und einem Countdown-Timer?
Eine Stoppuhr misst die verstrichene Zeit von null aufwärts — sie beantwortet 'Wie lange hat es gedauert?'. Ein Countdown-Timer startet von einer festgelegten Dauer und zählt auf null herunter — er beantwortet 'Wie viel Zeit bleibt noch?'. Dieses Tool ist eine Stoppuhr; für Countdown-Funktionalität verwende das Countdown-Timer-Tool.