Mohan pd.
Mohan pd. Author of The Coders Blog. Also a professional fullstack javascript developer working with various tech company and client around world.

Increasing Precision of Javascript Timeout & SetInterval

Oct 18, 2019 · 1 min
Increasing Precision of Javascript Timeout & SetInterval

We can schedule call in Javascript using following methods:

  • setTimeout allows us to run a function once after the interval of time.
  • setInterval allows us to run a function repeatedly, starting after the interval of time, then repeating continuously at that interval.

These methods are not a part of JavaScript specification. But most environments have the internal scheduler and provide these methods. In particular, they are supported in all browsers and Node.js.

setTimeout example
let timeoutId = setTimeout(func, delay, [arg1], [arg2])

Adding Precision to setTimeout methods.

This is a more precise version of the native setTimeout(). It uses the same parameters as setTimeout, but adds a third parameter “resolution” which defines how often (in ms) to check for the time that passed.

Sometime we might need to schedule task with some precision then we can write following function

const setExactTimeout = function(callback, duration, resolution) {
	const start = (new Date()).getTime();
	const timeout = setInterval(function(){
		if ((new Date()).getTime() - start > duration) {
			callback();
			clearInterval(timeout);
		}
	}, resolution);

	return timeout;
};

const clearExactTimeout = function(timeout) {
	clearInterval(timeout);
};

We can implement it with third argument as follow:

// alert after 5 seconds with an inaccuracy of 20 milliseconds
var timeout = setExactTimeout(function(){
   alert('done');
}, 5000, 20);

// comment out to show "done"
clearExactTimeout(timeout);