0

Why setTimeout callback is not executing even after the desired delay time.

It is taking more time to execute based on the time to execute the other code of the program.

console.time('CalculateExeutionTime');

console.log("Staring....");

setTimeout(() => {
   console.log("Inside setTimeout.");
}, 100);

console.log("Middle...");

let start = 0;
let end = 1000000000;
while(end > start){
  start++
}
console.log("End...");

console.timeEnd('CalculateExeutionTime')

Also when I set the time to execute the callback of setTimeout to zero, still it is not executing.

console.time('CalculateExeutionTime');

console.log("Staring....");

setTimeout(() => {
   console.log("Inside setTimeout.");
}, 0);

console.log("Middle...");

let start = 0;
let end = 1000000000;
while(end > start){
  start++
}
console.log("End...");

console.timeEnd('CalculateExeutionTime')

Is there any way that makes sure the setTimeout execute at the after the desired time.

Not A Bot
  • 2,474
  • 2
  • 16
  • 33
  • The setTimeout() method calls a function or evaluates an expression after a specified number of milliseconds. – Sato Takeru Jan 19 '21 at 09:01
  • 7
    JavaScript is single-threaded and you're blocking this one thread with your `while()` loop -> working as expected – Andreas Jan 19 '21 at 09:01
  • 2
    Have a look at https://developer.mozilla.org/en-US/docs/Web/JavaScript/EventLoop#event_loop – Felix Kling Jan 19 '21 at 09:02
  • prefer measurement by https://medium.com/better-programming/how-to-measure-execution-times-in-javascript-9b56a650650d – Harsh Gundecha Jan 19 '21 at 09:02
  • @George That was I am looking why ``setTimeout()`` is not executing after the desired milliseconds. – Not A Bot Jan 19 '21 at 09:02
  • If working with animations: https://stackoverflow.com/questions/38709923/why-is-requestanimationframe-better-than-setinterval-or-settimeout – Justinas Jan 19 '21 at 09:04
  • @Andreas Is there any way to run both parallelly, so that even when ``while()`` is executing the ``setTimeout()`` also execute – Not A Bot Jan 19 '21 at 09:04
  • What are you trying to accomplish (because your example doesn't make that much sense in its current form)? And no. There's just one thread, and `while()` blocks it. You can use a `ServiceWorker` but then we're back at my question... – Andreas Jan 19 '21 at 09:07
  • 1
    @NotABot don't use busy waits like this. It's usually a bad practice even in multi-threaded environments. What are you actually trying to do here? Because I suspect you don't have a loop that only keeps the application busy doing nothing in your code. If you want to have a game you need a game loop. If you have some sort of animation, then you can similarly progressively change it. The very broad problem doesn't have a singular solution other than "don't do that, work with the event loop". But that's not nearly specific enough. – VLAZ Jan 19 '21 at 09:08
  • Define and call function in one step `(function () { setTimeout(() => { console.log("Inside setTimeout."); }, 0); })();` – Damian Jan 19 '21 at 09:12
  • 1
    See [setTimeout#reasons_for_delays_longer_than_specified](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout#reasons_for_delays_longer_than_specified) on MDN – Cat Jan 19 '21 at 09:12

0 Answers0