Signatur
Beschreibung
Die schreibgeschützte Eigenschaft timeStamp jedes Event-Objekts gibt an, wann das Ereignis erzeugt wurde. Der Wert ist ein DOMHighResTimeStamp, also eine Gleitkommazahl in Millisekunden. Er wird relativ zum Zeitursprung (performance.timeOrigin) des aktuellen Dokuments bzw. Workers gemessen und nicht relativ zur Unix-Epoche.
Weil event.timeStamp und performance.now() dieselbe Zeitbasis nutzen, lässt sich damit gut messen, wie viel Zeit zwischen Nutzereingabe und Verarbeitung vergeht (Eingabeverzögerung). Auch Doppelklicks, Gesten-Geschwindigkeiten und Abstände zwischen Tastenanschlägen lassen sich präzise berechnen, ohne selbst Date.now() aufzurufen.
Der Wert wird beim Erzeugen des Ereignisses festgelegt, nicht beim Auslösen. Bei selbst erstellten Ereignissen (new Event(), new CustomEvent()) ist er der Zeitpunkt des Konstruktor-Aufrufs. Browser runden den Wert aus Sicherheitsgründen, damit keine Timing-Angriffe möglich sind.
Rückgabewert
performance.timeOrigin), eventuell mit Nachkommastellen. Die Eigenschaft ist schreibgeschützt.Beispiele
Eingabeverzögerung eines Klicks messen
const button = document.querySelector('#speichern');
button.addEventListener('click', (event) => {
// Zeit zwischen Ereigniserstellung und Handler-Ausführung
const verzoegerung = performance.now() - event.timeStamp;
console.log(`Eingabeverzögerung: ${verzoegerung.toFixed(1)} ms`);
});
Abstand zwischen Tastenanschlägen ermitteln
const eingabe = document.querySelector('#suche');
let letzterAnschlag = null;
eingabe.addEventListener('keydown', (event) => {
if (letzterAnschlag !== null) {
const abstand = event.timeStamp - letzterAnschlag;
console.log(`Abstand zur letzten Taste: ${Math.round(abstand)} ms`);
}
letzterAnschlag = event.timeStamp;
});
timeStamp in absolute Uhrzeit umrechnen
document.addEventListener('pointerdown', (event) => {
const epochMs = performance.timeOrigin + event.timeStamp;
console.log(new Date(epochMs).toISOString());
}, { once: true });
Zeitstempel eines eigenen Ereignisses
const ereignis = new CustomEvent('daten-geladen', { detail: { anzahl: 42 } });
// timeStamp wird beim Erzeugen gesetzt, nicht beim dispatchEvent()
setTimeout(() => {
document.addEventListener('daten-geladen', (e) => {
console.log(`Wartezeit bis Dispatch: ${Math.round(performance.now() - e.timeStamp)} ms`);
});
document.dispatchEvent(ereignis);
}, 500);
// Wichtig · Fallstricke
- Zeitbasis: Heute ist der Wert relativ zu
performance.timeOriginund nicht zur Unix-Epoche. Ältere Browser (z. B. Firefox vor Version 49, alte Safari-Versionen) lieferten Epoch-Millisekunden. Wer den Wert direkt mitDate.now()vergleicht, bekommt falsche Ergebnisse. Vergleiche stattdessen mitperformance.now(). - Reduzierte Genauigkeit: Zum Schutz vor Timing- und Fingerprinting-Angriffen (Spectre) runden Browser den Wert. Firefox rundet mit
privacy.reduceTimerPrecisionstandardmäßig auf 1 ms oder gröber, mitprivacy.resistFingerprintingauf bis zu 100 ms. Ohne Cross-Origin-Isolation ist die Genauigkeit meist geringer. - Die Eigenschaft ist schreibgeschützt. Zuweisungen werden ignoriert und werfen im Strict Mode keinen Fehler.
- Die Zeitursprünge von Iframes und Workers unterscheiden sich vom Hauptdokument. Werte aus verschiedenen Kontexten lassen sich nur über
performance.timeOriginvergleichbar machen. - Wenn du Eingabelatenz genau messen willst, liefert die Event Timing API (
PerformanceEventTiming) mehr Details.