building function track velocity of mouse best time can get?to build function have time/distance , more accurate in type of function date taken.but type of date?the time taken until point?milliseconds or more?
in javascript on browsers, have 2 options:
cross-browser, can use
date.now()
(ornew date().gettime()
on old ones) gives you, @ best, millisecond precision. number milliseconds-since-the-epoch (jan 1st 1970 @ midnight, gmt) whole number. on many modern browsers, resolution indeed to-the-millisecond, note that may not true browsers; robg points out in a comment browsers have resolution low 15ms while others may in 3-4ms range. in tests, chrome 50, firefox 46, , ie11 provide to-the-millisecond resolution; ie8 manages 10ms resolution.if need support up-to-date browsers, can use
performance.now()
(spec | mdn), returnsdomhighrestimestamp
floating-point number which:...should represent time in milliseconds accurate 5 microseconds...
note
if user agent unable provide time value accurate 5 microseconds due hardware or software constraints, user agent can represent
domhighrestimestamp
time in milliseconds accurate millisecond.so if browser supports it, required @ least have millisecond resolution , ideally much, better (via fractional values).
this snippet test current browser's date
object resolution (here's off-site version work on older browsers ie8):
(function() { "use strict"; if (!date.now) { date.now = function() { return new date().gettime(); }; } var testcount = document.getelementbyid("testcount"); var resolution = document.getelementbyid("resolution"); document.getelementbyid("the-button").onclick = function() { var sum = 0; var n = 0; log("checking browser's date object resolution..."); document.getelementbyid("results").style.display = ""; settimeout(batch, 50); function batch() { var target = n + 1000; while (n < target) { sum += test(); ++n; } testcount.innerhtml = n; resolution.innerhtml = (sum / n) + "ms"; if (n < 10000) { settimeout(batch, 50); } else { log("done"); } } }; function test() { var x = date.now(); var y; { y = date.now(); } while (x == y); return y - x; } function log(msg) { var p = document.createelement("p"); p.appendchild(document.createtextnode(msg)); document.body.appendchild(p); } })();
<input type="button" id="the-button" value="test"> <div id="results" style="display: none"> tests far: <span id="testcount">0</span> <br>rough resolution: <span id="resolution"></span> </div>
this snippet test current browser's performance.now()
resolution, if supports it:
(function() { "use strict"; if (typeof performance !== "object" || !performance.now) { log("your browser doesn't support performance.now()"); return; } var testcount = document.getelementbyid("testcount"); var resolution = document.getelementbyid("resolution"); document.getelementbyid("the-button").onclick = function() { var sum = 0; var n = 0; log("checking browser's performance.now() resolution..."); document.getelementbyid("results").style.display = ""; settimeout(batch, 50); function batch() { var target = n + 1000; while (n < target) { sum += test(); ++n; } testcount.innerhtml = n; resolution.innerhtml = (sum / n) + "ms"; if (n < 10000) { settimeout(batch, 50); } else { log("done"); } } }; function test() { var x = performance.now(); var y; { y = performance.now(); } while (x == y); return y - x; } function log(msg) { var p = document.createelement("p"); p.appendchild(document.createtextnode(msg)); document.body.appendchild(p); } })();
<input type="button" id="the-button" value="test"> <div id="results" style="display: none"> tests far: <span id="testcount">0</span> <br>rough resolution: <span id="resolution"></span> </div>