Get animation status in microseconds

Question

I animate the transition to 36,000 colors in 18 seconds using JavaScript. When the user clicks the button, he should receive a notification about what color the animation was at the time the button was clicked. However, JavaScript measures the time in milliseconds, which basically means that if the user presses the button at t = 10 ms, the animation will be at color 20, and when he clicks at t = 11 ms, the animation will already be at 22.

Is there a way to measure time more accurately in JavaScript? So, for example, I can say that the button was pressed at t = 10.5 ms so that the animation was in color 21.

Answer 1

performance.now,

, .

performance.now DomHighResTimeStamp ,

5 ().

var t1 = performance.now();
var t2 = performance.now();
console.log('passed ' + (t2 - t1) * 1000.0 + ' microseconds');

Hide result

A polyfill .

performance.now Paul Irish

, 60 ~ 16,67 , , . , , , , , , JS- , , , 16,67ms. , 32- , 2 1 .

, requestAnimationFrame.

. 60 , .