Closed
Description
I am reading the code of D3.js of 3.0. The function d3_timer_step() confuse me:
function d3_timer_step() { var now = d3_timer_mark(), delay = d3_timer_sweep() - now; if (delay > 24) { if (isFinite(delay)) { clearTimeout(d3_timer_timeout); d3_timer_timeout = setTimeout(d3_timer_step, delay); } d3_timer_interval = 0; } else { d3_timer_interval = 1; d3_timer_frame(d3_timer_step); } }
If delay larger than 24ms, the step would call after delay ms, but why is 24? why not 16.7 or others ?
Could anyone tell me why? Thanks very much!
Metadata
Metadata
Assignees
Labels
No labels
Type
Projects
Milestone
Relationships
Development
No branches or pull requests
Participants
Activity
mbostock commentedon Jul 19, 2016
It’s arbitrary, and changing it by a few milliseconds would likely have no apparent effect. The accuracy of setTimeout tends to be fairly poor—because the browser and operating system can be doing other things, the callback can be off by 10-20 ms. Generally speaking using requestAnimationFrame is preferred for rendering tasks, since it tries to consolidate operations that modify the DOM before redrawing. 24 is about half-way between one frame (16.7) and two (33.3), so that’s when we switch from using requestAnimationFrame to setTimeout for the delay.
But again, this only matters if the shortest delay of any active timer is 24 ms. If there’s an active animation, for instance, then requestAnimationFrame tends to always be used, and slower timers may still be called back once they become active.