Where does a browser event's timeStamp come from in Javascript? -


event objects passed event handler callbacks contain event.timestamp of when event occurred, timestamp produced? bubbles underlying os, or generated browser?

i'm interested in gauging reliability of timestamp , recognise later timestamp produced less accurate it's be.

also, way in timestamp produced vary between platforms , browser implementations?

thanks.

according dom4 specification ยง4.2, it's assigned when event created (you have scroll down bit):

the timestamp attribute must return value initialized to. when event created attribute must initialized number of milliseconds have passed since 00:00:00 utc on 1 january 1970, ignoring leap seconds.

which leads question of: when event created? can think of 3 times might done:

  1. when os notifies browser

  2. when javascript main ui thread next able anything

  3. when javascript main ui thread dispatch task related event

using snippet below, @ least click event, seems vary browser:

  • chrome seems assign timestamp when javascript main ui thread ready handle event (#3 above); can after event happened, if main javascript ui thread has had chance other things in interim. (for me, surprising.)

  • firefox seems assign timestamp when event occurs (#1 above), regardless of main javascript ui thread doing. have expected.

  • ie seems chrome (#3), can't rule out possibility assign timestamp third click when second click processed (#2), because can't recognize click on third button when things busy.

// sadly, firefox has bug (https://bugzilla.mozilla.org/show_bug.cgi?id=77992)  // timestamp not epoch, it's system start. work relative  // moment clicked first button rather working nice clean absolute data.    // sadly, ie11 doesn't clicking second button , moving on  // click third, data clicking second suggests it's more  // chrome firefox.  var start1;  var start2;  document.getelementbyid("start").addeventlistener("click", function(e) {    // remember event's timestamp    start1 = e.timestamp;    start2 = 0;      // start busy-loop 3 seconds, locking main js thread    busy(3000);    display("done first busy loop");  }, false);    document.getelementbyid("then1").addeventlistener("click", function(e) {    // show time since first event    showelapsed(e.timestamp);      // remember event's timetsamp    start2 = e.timestamp;      // busy-loop, second time    busy(1000);    display("done second busy loop");  }, false);    document.getelementbyid("then2").addeventlistener("click", function(e) {    // show time since first , second events    showelapsed(e.timestamp);  }, false);    function showelapsed(ts) {    display("elapsed first event: " + (ts - start1) + "ms");    if (start2) {      display("elapsed 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 afterward">  <input type="button" id="then2" value="then me after (not on ie!)">


Comments

Popular posts from this blog

apache - PHP Soap issue while content length is larger -

asynchronous - Python asyncio task got bad yield -

javascript - Complete OpenIDConnect auth when requesting via Ajax -