Где находится время-время события браузера в Javascript?

Question

Объекты событий, переданные обратным вызовам обработчика событий, содержат событие event.timeStamp, когда произошло событие, но где создается метка времени? Это что-то, что вырывается из базовой ОС или генерируется браузером?

Мне интересно оценить надежность метки времени и признать, что чем позже будет создана метка времени, тем она будет менее точной.

Также существует ли способ создания временной метки между платформами и реализациями браузера?

Спасибо.

Answer 1

Согласно DOM4 specification §4.2, ему присваивается, когда событие создано (вы должны прокрутите немного вниз):

Атрибут timeStamp должен вернуть значение оно инициализируется. Когда событие создается, атрибут должен быть инициализирован до количества миллисекунд, прошедших с 00:00:00 по UTC 1 января 1970 года, игнорируя секунды прыжка.

Это приводит к вопросу о: Когда событие создано? Я думаю, что в три раза это может быть сделано:

1. Когда ОС уведомляет браузер

2. Когда основной поток пользовательского интерфейса JavaScript рядом может сделать что-нибудь

3. Когда Основная часть основного интерфейса JavaScript собирает задачу, связанную с событием

Использование sn ippet ниже, по крайней мере, для click события, кажется, различаются в зависимости от браузера:

• Хром, кажется, чтобы назначить timeStamp, когда основной поток пользовательского интерфейса JavaScript готов к ручке события (# 3 выше); это может быть значительно после того, как событие действительно произошло, даже если основной поток пользовательского интерфейса JavaScript имел возможность делать другие вещи в промежуточный период. (Для меня это было очень удивительно.)

• Firefox, кажется, назначает timeStamp, когда происходит событие (№ 1 выше), независимо от того, что делает основной поток пользовательского интерфейса JavaScript. Это то, чего я ожидал.

• IE кажется делать то, что делает Chrome (# 3), но я не исключаю возможность, что бы присвоить метку времени для третьего щелчка, когда второй щелчок обрабатывается (# 2), потому что я не может заставить его распознать нажатие на третью кнопку, когда все занято.

// Sadly, Firefox has a bug (https://bugzilla.mozilla.org/show_bug.cgi?id=77992) where 
 
// timeStamp is not from The Epoch, it's from system start. So we work relative to the 
 
// moment you clicked the first button rather than working with nice clean absolute data. 
 

 
// Sadly, IE11 doesn't like you clicking the second button and then moving over to 
 
// click the third, but the data from just clicking the second suggests it's more like 
 
// Chrome than Firefox. 
 
var start1; 
 
var start2; 
 
document.getElementById("start").addEventListener("click", function(e) { 
 
    // Remember this event's timestamp 
 
    start1 = e.timeStamp; 
 
    start2 = 0; 
 

 
    // Start a busy-loop for three seconds, locking up the main JS thread 
 
    busy(3000); 
 
    display("Done with first busy loop"); 
 
}, false); 
 

 
document.getElementById("then1").addEventListener("click", function(e) { 
 
    // Show time since first event 
 
    showElapsed(e.timeStamp); 
 

 
    // Remember this event's timetsamp 
 
    start2 = e.timeStamp; 
 

 
    // Another busy-loop, just a second this time 
 
    busy(1000); 
 
    display("Done with second busy loop"); 
 
}, false); 
 

 
document.getElementById("then2").addEventListener("click", function(e) { 
 
    // Show time since first and second events 
 
    showElapsed(e.timeStamp); 
 
}, false); 
 

 
function showElapsed(ts) { 
 
    display("Elapsed from first event: " + (ts - start1) + "ms"); 
 
    if (start2) { 
 
    display("Elapsed from second event: " + (ts - start2) + "ms"); 
 
    } 
 
} 
 

 
function busy(duration) { 
 
    var target = Date.now() + duration; 
 
    while (Date.now() < target) { 
 
    // Wait 
 
    } 
 
} 
 

 
function display(msg) { 
 
    var p = document.createElement('p'); 
 
    p.innerHTML = msg; 
 
    document.body.appendChild(p); 
 
} 
 
function format(ts) { 
 
    return new Date(ts).toISOString().substring(11, 23); 
 
}

<input type="button" id="start" value="Click me"> 
 
<input type="button" id="then1" value="Then me quickly afterward"> 
 
<input type="button" id="then2" value="Then me quickly after that (not on IE!)">