# timestamp in callback requestAnimationFrame function

**URL:** <https://forum.kirupa.com/t/timestamp-in-callback-requestanimationframe-function/642777>\
**Category:** Uncategorized\
**Created:** [May 15, 2020, 8:02pm UTC](https://forum.kirupa.com/t/timestamp-in-callback-requestanimationframe-function/642777 "2020-05-15T20:02:05Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Umair\_Ashraf](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/umair_ashraf/32/11705_2.png) [@Umair\_Ashraf](https://forum.kirupa.com/u/Umair_Ashraf)\
**Post date:** [May 15, 2020, 8:02pm UTC](https://forum.kirupa.com/t/timestamp-in-callback-requestanimationframe-function/642777/1 "2020-05-15T20:02:05Z")

</div>

Hi Guys,  
I am actually trying to understand the timestamp value calculation in the below code snippet (this is actually a paddle moving from left to right and the code is working all fine)

But i am still a bit confused with the return value it produces , like in the below code…

```javascript
function gameLoop(timestamp){
    let deltaTime=timestamp- lastTime;
    lastTime = timestamp;
    ctx.clearRect(0,0,800,600);
// the update function will recalculate the x and y coordinate from where the new paddle will appear
    paddle1.update(deltaTime);
// the draw method will redraw the paddle with new x,y coordinates 
    paddle1.draw(ctx);
  
    requestAnimationFrame(gameLoop);
}
gameLoop();

```

so, the thing i am confused about is,  
1- when the gameloop() fuction is called first, it will go through the gamLoop function with no parameter?, so will timestamp will be zero initially?  
2- also how come requestAnimationFrame(gameLoop); will return a timestamp value (that will then be used by gameloop each time it get looped)?

really appreciate your help 🙂  
Thanks  
Umair

---

<div class="post-metadata">

**Author:** ![senocular](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/senocular/32/7217_2.png) [@senocular](https://forum.kirupa.com/u/senocular)\
**Post date:** [May 15, 2020, 9:56pm UTC](https://forum.kirupa.com/t/timestamp-in-callback-requestanimationframe-function/642777/2 "2020-05-15T21:56:25Z")

</div>

> [@Umair\_Ashraf](#):
>
> 1- when the gameloop() fuction is called first, it will go through the gamLoop function with no parameter?, so will timestamp will be zero initially?

When functions with parameters are called without arguments for those parameters, those parameters are set to `undefined`. So in that first `gameLoop()` call, `timestamp` is going to be `undefined` - something you don’t want since that will cause your calculations to result in `NaN`. In fact that first call (and second, for that matter) should not work.

> [@Umair\_Ashraf](#):
>
> 2- also how come requestAnimationFrame(gameLoop); will return a timestamp value (that will then be used by gameloop each time it get looped)?

This is how `requestAnimationFrame()` works. Just like callbacks you send to `addEventListener()` get called with an `Event` argument, so too do `requestAnimationFrame()` callbacks get called with a `timestamp` argument, at least when the function is called through `requestAnimationFrame()` and not manually as is the case with the `gameLoop()` at the bottom.

You can get the value of `timestamp` using `performance.now()`, so if you want to simulate that when calling `gameLoop()` yourself, you can.

```javascript
gameLoop(performance.now());

```

Or, you can skip calling it yourself and pass it into `requestAnimationFrame()` so it will automatically get called with it.

```javascript
requestAnimationFrame(gameLoop); // instead of gameLoop()

```