JavaScript Sleep Function

October 10th, 2008, 12:25 pm

joebert,

I admit that sleeping in JavaScript is a kludgy thing to do, especially if we're talking about a Web application. Any time I consider sleeping, I usually come up with a more elegant solution.

I came across this discussion because I finally found a case where I really did want to sleep. I was developing a quick-and-dirty tool to evaluate the skills of software testers. It's a specialized calculator with all sorts of deliberate bugs. When interviewing candidates, I present them with this buggy calculator, give them a few minutes, observe their technique and tabulate how many defects they find. One of the defects is that the user interface becomes slow to respond under certain conditions. I use a sleep function to create this latency.

October 11th, 2008, 11:35 pm

I have one that my AJAX class uses to wait for retry or something like that. This topic has a crazy hits, wow.

October 31st, 2008, 8:17 am

joebert wrote:

I still can't figure out what use a sleep function for JS is.

Okay, here is why I need it: I am programming a multi-player game based on the old "concentration" game where you flip over two cards and if they match, you get a point. Otherwise play moves to the next player.

Now this work's great when you're playing it on a table and you see what cards the other player flipped, but when you're playing online and are at a different computer, I want to reveal the two cards that were flipped to the remote players, and I think it is more pleasing (and realistic) to flip one card over, wait a second, then flip the second one.

Okay, sure, I can certainly work around this with timeouts, etc. But really all I want is a simple sleep function so I can do this:

Code: [ Download ] [ Select ]

revealCard (card1);
sleep (1000);
revealCard (card2);
sleep (1000);
clearCards ();
 
// I would prefer to get control back here after cards are cleared.

1. revealCard (card1);
2. sleep (1000);
3. revealCard (card2);
4. sleep (1000);
5. clearCards ();
6.  
7. // I would prefer to get control back here after cards are cleared.

Instead, my solution is:

Code: [ Download ] [ Select ]

revealCard (card1);
setTimeout("revealCard ("+card2+")", 1000);
setTimeout("clearCards()", 2000);
setTimeout("restOfCode("+var1+","+var2+",...,"+varN+")", 3000);

1. revealCard (card1);
2. setTimeout("revealCard ("+card2+")", 1000);
3. setTimeout("clearCards()", 2000);
4. setTimeout("restOfCode("+var1+","+var2+",...,"+varN+")", 3000);

where restOfCode is the code I want to execute after clearing cards, and var1-varN are the local variables I now want to pass to this code.

We can debate which is more elegant, but I personally think the sleep version is more straightforward.

...Lance

February 24th, 2009, 7:37 am

I think this can be solved with the setTimeout function. At least in the
case where one wants to delay in a loop. If one creates a while-loop
between two functions the timeout can be used in one end.

Code: [ Download ] [ Select ]

 
function do_something(i) {
   if (i > 30)
     return;
   // do soemthing
   setTimeout("loop_implementation("+i+")", 10000);
}
 
function loop_implementation(i) {
   i = i + 1;
   do_something(i);
}
 

1.  
2. function do_something(i) {
3.    if (i > 30)
4.      return;
5.    // do soemthing
6.    setTimeout("loop_implementation("+i+")", 10000);
7. }
8.  
9. function loop_implementation(i) {
10.    i = i + 1;
11.    do_something(i);
12. }
13.  

This way one can call do_something with 0 and it will be done 30
times with a 10 sec. delay between the steps. For an infinite loop
just replace return with setting i = 0.

--
Øyle

February 24th, 2009, 7:51 am

General case.

Code: [ Download ] [ Select ]

 
function do_something(i) {
   switch(i) {
     case 0:
       before_wait();
       break;    
     case 1:
       after_wait();
       break;
     default:
       return;
   }
   setTimeout("loop_implementation("+i+")", 10000);
}
 
function loop_implementation(i) {
   i = i + 1;
   do_something(i);
}
 
function before_wait() {/* something */}
function after_wait() {/* something else */}
 

1.  
2. function do_something(i) {
3.    switch(i) {
4.      case 0:
5.        before_wait();
6.        break;    
7.      case 1:
8.        after_wait();
9.        break;
10.      default:
11.        return;
12.    }
13.    setTimeout("loop_implementation("+i+")", 10000);
14. }
15.  
16. function loop_implementation(i) {
17.    i = i + 1;
18.    do_something(i);
19. }
20.  
21. function before_wait() {/* something */}
22. function after_wait() {/* something else */}
23.  

--
Øyle

November 20th, 2009, 3:03 pm

Just wanted to add my $0.02 to this:

Under any normal circumstances, there is no need for a real sleep function. As many others have indicated, there are more elegant solutions for most cases. In my case, I needed a real sleep function. I have an onUnload function that needs an extra second or two to process before the window is destroyed. In this case, setTimeout, and many other solutions failed and I needed a method to force the window to stay open and let the onUnload function do its business. It's a quick and dirty solution, but it sure beats rewriting someone else's code entirely.

[joebert]

November 20th, 2009, 10:05 pm

All of you guys who want to use a sleep function to clog up script execution really should study event handlers better. Javascript has an awesome event model just for situations like these.

Explainit it in detail is beyond the scope of a single forum thread, but some useful search terms to include with your "javascript" queries will be "event handlers", "watch/unwatch", "callback functions", "addEventListener", "dispatch".

You're clogging up execution with while loops and jury rigged sleep functions like that. There are already timer loops running that look for events to perform actions for.

But hey, if it works for you, do it I suppose.