Non-looping GIFs in unfocused tabs never paint final frame

[stalgiag]

Most appropriate sub-area of p5.js?

• [ ] Accessibility (Web Accessibility)
• [ ] Build tools and processes
• [ ] Color
• [ ] Core/Environment/Rendering
• [ ] Data
• [ ] DOM
• [ ] Events
• [ ] Friendly error system
• [x] Image
• [ ] IO (Input/Output)
• [ ] Localization
• [ ] Math
• [ ] Unit Testing
• [ ] Typography
• [ ] Utilities
• [ ] WebGL
• [ ] Other (specify if possible)

Details about the bug:

• p5.js version: main branch
• Web browser and version: all
• Operating System:
• Steps to reproduce this:

Upload a non-looping GIF, switch tabs, wait a few seconds, return to sketch. The GIF will be frozen on the frame that it was on when the tab was switched.

I will try to loop back around and make a sketch example soon but in the meantime, someone else is welcome to do so.

related to #5484

[stampyzfanz]

Reproduced with example sketch: https://editor.p5js.org/stampyzfanz/sketches/Wn9GsiQs2

[yashlamba]

Hi, new to p5.js and looking forward to contribute!

I looked into this issue and it comes down to how we evaluate number of frames to skip here: https://github.com/processing/p5.js/blob/c3f4121619174db5eaaf09b8ca51c93d530caa27/src/image/p5.Image.js#L236 and this condition: https://github.com/processing/p5.js/blob/c3f4121619174db5eaaf09b8ca51c93d530caa27/src/image/p5.Image.js#L241-L243

I would like to work on this, but what is the ideal behaviour here? When someone switched tab, should the GIF:

1. pause and resume or
2. Continue running
   • If there are still frames left (gif takes 1 min and user switched for 30 seconds), it should resume from +30 seconds of when the tab was switched.
   • If no frames are left, show the last frame.