Временные метки событий в высоком разрешении

Свойство timeStamp интерфейса Event указывает время, в которое произошло данное событие.

В версиях Chrome до 49 это значение timeStamp было представлено как DOMTimeStamp , которое представляло собой целое число миллисекунд с момента начала системы , что очень похоже на значение, возвращаемое Date.now() .

Начиная с Chrome 49, timeStamp представляет собой значение DOMHighResTimeStamp . Это значение по-прежнему представляет собой количество миллисекунд, но с микросекундным разрешением, что означает, что значение будет включать десятичную часть. Кроме того, вместо значения, относящегося к эпохе, значение относится к PerformanceTiming.navigationStart , т. е. ко времени, когда пользователь перешел на страницу.

Преимущества дополнительной точности меток времени можно увидеть в следующих примерах:

Вопросы кроссбраузерности и устаревших версий

Если у вас есть существующий код, который сравнивает значения Event.timeStamp из двух событий, вам не придется корректировать свой код из-за перехода на DOMHighResTimeStamp . Более того, в браузерах, поддерживающих DOMHighResTimeStamp , ваш существующий код выиграет от повышенной точности в микросекундах, а также от того факта, что DOMHighResTimeStamp гарантированно будет монотонно увеличиваться , независимо от того, изменяются ли системные часы в середине выполнения вашей веб-страницы.

Если вместо сравнения двух значений Event.timeStamp вашему коду необходимо определить, как давно произошло событие, новое значение DOMHighResTimeStamp можно сравнить непосредственно с performance.now() . А если вам нужно преобразовать Event.timeStamp в абсолютное количество миллисекунд с момента начала системы, вы можете получить это значение, добавив DOMHighResTimeStamp к performance.timing.navigationStart .

В обоих этих случаях DOMTimeStamp и DOMHighResTimeStamp ведут себя по-разному, но вы можете упростить свой кроссбраузерный код, используя эту функцию преобразования , любезно предоставленную Маджидом Валипуром . Он принимает объект Event в качестве параметра и возвращает значение, подобное DOMHighResTimeStamp , готовое для сравнения с performance.now() или добавления в performance.timing.navigationStart .