# saveGif() delay doesn't work

**URL:** <https://discourse.processing.org/t/savegif-delay-doesnt-work/45706>\
**Category:** Coding Questions\
**Created:** [February 4, 2025, 10:54am UTC](https://discourse.processing.org/t/savegif-delay-doesnt-work/45706 "2025-02-04T10:54:29Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Chloros](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chloros/32/20094_2.png) [@Chloros](https://discourse.processing.org/u/Chloros)\
**Post date:** [February 4, 2025, 10:54am UTC](https://discourse.processing.org/t/savegif-delay-doesnt-work/45706/1 "2025-02-04T10:54:29Z")

</div>

Hi,

I’m trying to export some gifs with the function saveGif() ( [https://p5js.org/reference/p5/saveGif/](https://p5js.org/reference/p5/saveGif/) ) but it seems taht the delay before recording the images doesn’t work. It records the gif but doesn’t apply any delay before.

I tried this:

```auto
function setup() {
  createCanvas(1920, 1080);
  saveGif('my_file', 1, {delay: 5, units: 'seconds'});
}

function draw() {
  
  for (let i = 0;i<10;i++){ 
    stroke(255);
    line(random(width), random(height), random(width), random(height));
  }

}

```

And this, in the manner of the example written in the reference page and inspired from the youtube example ( [https://www.youtube.com/shorts/CEnfKhs6wLg](https://www.youtube.com/shorts/CEnfKhs6wLg) ):

```auto
function setup() {
  createCanvas(1920, 1080);
}
// Save a 5-second gif when the user presses the 's' key.
 function keyPressed() {
   if (key === 's') {
     const options = {
       units: "frames",
       delay:300} // 
     }
     saveGif('random_rgb_lines_0', options);
 }

function draw() {
  
  for (let i = 0;i<10;i++){ 
    stroke(255);
    line(random(width), random(height), random(width), random(height));
  }
}

```

In this last one it reloads the sketche when I press ‘s’ and then it records the gif (with frames or seconds it’s the same).

Any idea ? I didn’t find more precisions on the web.

Thanks

---

<div class="post-metadata">

**Author:** ![davepagurek](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/davepagurek/32/17535_2.png) [@davepagurek](https://discourse.processing.org/u/davepagurek)\
**Post date:** [February 4, 2025, 5:59pm UTC](https://discourse.processing.org/t/savegif-delay-doesnt-work/45706/2 "2025-02-04T17:59:51Z")

</div>

The delay currently gets applied by starting `frameCount` at a higher number than usual instead of starting at 0 and not recording the first few frames, so unfortunately this means sketches like your example that build up content over time end up working the same way as usual. For now your best bet might be to record from the start, and use a third party tool to clip the beginning of the gif off.

---

<div class="post-metadata">

**Author:** ![Chloros](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chloros/32/20094_2.png) [@Chloros](https://discourse.processing.org/u/Chloros)\
**Post date:** [February 4, 2025, 8:48pm UTC](https://discourse.processing.org/t/savegif-delay-doesnt-work/45706/3 "2025-02-04T20:48:49Z")

</div>

Thanks @davepagurek, I don’t get exactly what you mean, ok for the third party tool but could you explain what is possible to do with this delay ?

---

<div class="post-metadata">

**Author:** ![davepagurek](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/davepagurek/32/17535_2.png) [@davepagurek](https://discourse.processing.org/u/davepagurek)\
**Post date:** [February 4, 2025, 9:11pm UTC](https://discourse.processing.org/t/savegif-delay-doesnt-work/45706/4 "2025-02-04T21:11:47Z")

</div>

The `frameCount` variable in p5 usually tells you what frame you’re on, and the `delay` parameter seems to start that value at something like 3\*60 if you ask for a 3s delay. If you have a sketch where each frame depends only on that – so, it clears the screen every frame, and positions everything just based on the frame number, such as drawing a circle at an x value of `frameCount` – then this seeks your sketch forward in time with no issues.

Your sketch, though, depends on the previous frame’s canvas, since it just adds lines incrementally instead of fully redrawing based on the `frameCount`. So that unfortunately won’t seek ahead when p5 starts `frameCount` at a higher number.

To turn your sketch into something that depends only on `frameCount`, you could write it like this:

```js
function draw() {
  randomSeed(0);

  // Every frame, clear the screen, and redraw every line that should be visible
  background(255);
  // Draw more lines the farther into the animation we get
  for (let j = 0; j < frameCount; j++) {
    for (let i = 0;i<10;i++){ 
      stroke(255);
      line(random(width), random(height), random(width), random(height));
    }
  }
}

```

This will be less efficient if you’re just running your sketch live, since each frame draws successively more and more lines, but it might make gif export work correctly.

---

<div class="post-metadata">

**Author:** ![Chloros](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chloros/32/20094_2.png) [@Chloros](https://discourse.processing.org/u/Chloros)\
**Post date:** [February 5, 2025, 9:44am UTC](https://discourse.processing.org/t/savegif-delay-doesnt-work/45706/5 "2025-02-05T09:44:33Z")

</div>

That’s perfect, thanks the explanation and for the sketch @davepagurek !
