Recursive calls cause call stack to overflow but not event queue?

Question

I recently came across this snippet of code:

The following recursive code will cause a stack overflow if the array list is too large. How can you fix this and still retain the recursive pattern?

  var list = readHugeList();
  var nextListItem = function() {
      var item = list.pop();

      if (item) {
          // process the list item...
          nextListItem();
      }
  };

The answer was:

var list = readHugeList();
var nextListItem = function() {
    var item = list.pop();

    if (item) {
        // process the list item...
        setTimeout( nextListItem, 0);
    }
};

Explanation: The stack overflow is eliminated because the event loop handles the recursion, not the call stack. When nextListItem runs, if item is not null, the timeout function (nextListItem) is pushed to the event queue and the function exits, thereby leaving the call stack clear. When the event queue runs its timed-out event, the next item is processed and a timer is set to again invoke nextListItem. Accordingly, the method is processed from start to finish without a direct recursive call, so the call stack remains clear, regardless of the number of iterations.

So, the overhead of the call stack was being handled by the event queue? Is there a maximum number of events after which the event queue cannot take any more events and how does that number compare to the call stack's limit of the function calls it can stack? Also, is there an alternative way to achieve the same thing?

I'm not sure what the limit of events in the event queue is but in this example there is only 1 event in the queue at any given time. — gforce301
– gforce301, Commented Apr 5, 2018 at 18:10

Bergi · Accepted Answer · 2018-04-05 18:28:29Z

So, the overhead of the call stack was being handled by the event queue?

Not exactly. There is only one event queued at a time. The difference is that it forgets where it was scheduled from - if it had to retain that information, it would run out of memory as well.

For the recursion, the compiler/interpreter may do a similar thing, throwing away the no longer needed call stack as tail call optimisation. The Safari browser has implemented this, for example.

Also, is there an alternative way to achieve the same thing?

A loop, of course :-)

function nextListItem = function() {
    for (var item = list.pop(), item, item = list.pop()) {
        // process the list item...
    }
}

How can you fix this and still retain the recursive pattern?

You can use trampolining to do the TCO manually.

function call(run) {
    return { done: false, run };
}
function stop(value) {
    return { done: true, value };
}
function runTrampoline(cont) {
    while (!cont.done) cont = cont.run();
    return cont.value;
}

var list = readHugeList();
function nextListItem() {
    return runTrampoline(nextListItemT());
}
function nextListItemT() {
    var item = list.pop();
    if (item) {
        // process the list item...
        return call(nextListItemT);
    } else {
        return stop();
    }
}

Jared Smith · Accepted Answer · 2018-04-05 18:17:27Z

1

When you make a recursive function call, a new frame goes on to the stack:

function foo() {
  foo();
}

This will push frames on forever until the memory allocated to the stack is exhausted.

But with setTimeout:

function foo() {
  setTimeout(foo, 0);
}

The old stack frame is removed before the queued up call to foo fires.

Think about it like this:

var stack = [];

// fails eventually
function foo() {
  stack.push({});
  foo();
}

function timedOut() {
  stack.pop(); // this makes it all ok
  fooWithTimeout();
}

function fooWithTimeout() {
  stack.push({});
  timedOut();
}

answered Apr 5, 2018 at 18:17

Jared Smith

22.3k5 gold badges50 silver badges98 bronze badges

Collectives™ on Stack Overflow

Recursive calls cause call stack to overflow but not event queue?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related