[p5.js 2.0 Bug Report]: saveGif generates black frames at start of gif

Most appropriate sub-area of p5.js?

• Accessibility
• Color
• Core/Environment/Rendering
• Data
• DOM
• Events
• Image
• IO
• Math
• Typography
• Utilities
• WebGL
• Build process
• Unit testing
• Internationalization
• Friendly errors
• Other (specify if possible)

p5.js version

2.0.5

Web browser and version

Safari (20622.1.22.118.4), Chrome 141.0.7390.55

Operating system

macOS Sequoia 15.7.1

Steps to reproduce this

Steps:

1. Add saveGif to default template (also fails if other elements added)
2. Set p5.js version to 2.0 or higher
3. Run and create gif

Gifs created with version 2.0 or higher insert 2 black frames at the beginning of each gif. The two black frames come before the draw loop runs. For example, in the below code/attached gif, it contains 2 black frames and then numbered frames 1-58.

The same code run with p5 1.x will not produce these two black frames and will contain 60 frames from the draw loop. When the below code is run in 1.11.10, it creates numbered frames 1-60.

A similar issue was reported in https://github.com/processing/p5.js/issues/6080 and fixed (https://github.com/processing/p5.js/pull/6081). It appears this same fixed code was carried through to 2.0.x

Snippet:

function setup() {
  createCanvas(400, 400);
  saveGif("sketch", 1)
  textSize(48)
}

function draw() {
  background(220);
  text(frameCount, width/2, height/2)
}

Start with the saveGif implementation and compare its behavior in p5.js 2.0.5 with 1.11.10, also reviewing the related issue #6080 and fix in pull request #6081. Reproduce the supplied sketch and verify that the generated GIF starts with the draw-loop frames, without two black frames, and contains the expected 60 frames.