setTimeout behaviour with blocking code

by

JavaScript is single-threaded. If some block of code uses execution thread, no other code can be executed. This means your setTimeout() call must wait until main execution (the one with busy-waiting while loop) finishes.

Here is what happens: you schedule setTimeout() to execute after a second and then block main thread for 3 seconds. This means the moment your busy loop finishes, timeout is already 2 seconds too late – and JS engine tries to keep up by calling your timeout as soon as possible – that is, immediately.

In fact this:

while (Date.now() < start + 3000) {}

is one of the worst things to do in JavaScript. You hold JavaScript execution thread for 3 seconds and no other event/callback can be executed. Typically browsers “freeze” in that period of time.

More Related Contents:

  1. Why is bracket notation not working here? [duplicate]
  2. setTimeout in a for loop with array as an argument misbehaving
  3. Why is the method executed immediately when I use setTimeout?
  4. Calling functions with setTimeout()
  5. Chrome: timeouts/interval suspended in background tabs?
  6. Best way to iterate over an array without blocking the UI
  7. What is minimum millisecond value of setTimeout?
  8. Is there ever a good reason to pass a string to setTimeout?
  9. setTimeout ignores timeout? (Fires immediately) [duplicate]
  10. Why the function called by setTimeout has no callstack limit?
  11. What is setTimeout doing when set to 0 milliseconds?
  12. setTimeout / clearTimeout problems
  13. setInterval in a React app
  14. setInterval/setTimeout return value
  15. Maximum call stack size exceeded on SetTimeout recursive function (Javascript) [duplicate]
  16. find the time left in a setTimeout()?
  17. How do I clear this setInterval inside a function?
  18. Is there a faster way to yield to Javascript event loop than setTimeout(0)?
  19. using setTimeout synchronously in JavaScript
  20. How to test a function which has a setTimeout with jasmine?
  21. Get return value from setTimeout [duplicate]
  22. Is setTimeout with no delay the same as executing the function instantly?
  23. Why does the Promise object block rendering?
  24. Why is the function executed immediately when I use setTimeout?
  25. recursive function vs setInterval vs setTimeout javascript
  26. setTimeout not working inside forEach
  27. Call setTimeout without delay
  28. how many javascript setTimeout/ setInterval call can be set simultaneously in one page?
  29. setTimeout(): If not defined in EcmaScript spec, where can I learn how it works?
  30. Is it bad practice to pass a string to settimeout? If yes, why? [duplicate]

Leave a Comment