Is This code inefficient? PORODOMO CLOCK

function progress()
  if(activity === "session")
    clock = sessionClock(); 
    clock = breakClock();
  clock.animate(1.0, function(){                     //Callback
    activity = (activity === "session"?"break":"session");
    progress();  //Call Progress again.

I’ve created two functions(sessionClock and breakClock) to return two clocks one for ‘session’, one for ‘break’.
Once one of the clocks completes, i destroy it and call the progress() function in the callback function of the clock.animate.

It repeats forever, toggling between session and break calling progress() each time.

My question is,
is this code efiicient? will progress() be added to function call stack each time?

i used progressBar.js

The answer is both yes and no. Tail end recursion optimization is something that’s in the ES6 spec, and this would (I think) recognize that progress will always have the same return value and prevent a memory leak. Browser support is lacking right now, unfortunately, with Safari 10+ being the only browser to have it implemented (source). The good news is that each call is going to be very small, so a person could use your app for some time before noticing a problem.

1 Like

Will the function progress() be added to the call stack on top of each other?

I made the progress() return a value and it returned it, so, i assumed that one progress() will be removed and another progress() will take its place on the call stack.

I’m I wrong here?

Is it because of closure that all calls to the progress will be there in the stack?

That’s essentially how it works. Relevant parts of the stack frame are overwritten and the same cod is reused.

Tail call elimination doesn’t remove anything, it reuses code intelligently. You can read more about it here.

That’s a good question, and honestly I don’t know if closures play any role in this. If you can find the answer, please do update us here.

1 Like