tracker: GIFBuilder

[ibgreen]

File size

• [ ] Add test setup (set of images to compress). @chrisgervang
• [ ] Compare with GIF optimizers to get baseline for what good file size looks like @chrisgervang

Encoding performance

• [ ] Experiment with 'sampleInterval': option @chrisgervang
• [x] See if increasing the number of workers help. @chrisgervang
• [ ] Modify API to start encoding when first image is added (parallelize rendering and encoding).

General

• [ ] Code cleanup - Cut out non-essential gifshot code related to webcam etc. Convert code to ES6.

[chrisgervang]

The settings of the intermediate capture (the images of the captured canvas) play a significant role on performance (less so on final file size), so I think tuning with a hubble/deck setup in addition to test images is important for the benchmark to get a full idea.

[chrisgervang]

https://github.com/visgl/loaders.gl/blob/9df9ba6d1f0234676dfca495ec1ed9b3d5780639/modules/video/src/gif-builder.js#L23

I don't think their documentation on frameDuration makes sense. In the implementation, this option seems to be "number of times to repeat the same frame.", which I in my mind is just a waste of filesize.

https://github.com/yahoo/gifshot/blob/cf0bd5fa831defa184e596b0b6df5aef9cccba94/src/modules/core/AnimatedGIF.js#L241-L246

for (let i = 0; i < frameDuration; i ++) { gifWriter.addFrame(0, 0, width, height, frame.pixels, { palette: framePalette, delay: delay }); }

Also I should dynamically set the interval option as it relates to my framerate concept, since this is the value used to determine a frames duration on screen.

https://github.com/yahoo/gifshot/blob/cf0bd5fa831defa184e596b0b6df5aef9cccba94/src/modules/core/AnimatedGIF.js#L230

It should be 1 sec / X fps. The default of 0.1 is appropraiate for 10fps. For 15fps I'll set interval to 0.066.

[chrisgervang]

Here is a spreadsheet of runs I've benchmarked so far. So far early findings:

• The intermediate format does impact capture time and save time, and did not affect file size. A JPEG at 80% balances quality and performance well.
• The diminishing returns point for number of workers was 4. 3 is also acceptable.

Still working out a FPS and sampleInterval recommendation. The retina double pixel density (doubles resolution?) effects capture and save performance, and I may recommend reducing it during rendering (is that possible?)

[ibgreen]

I am surprised that the intermediate format has such a big impact. Since I assume the algorithm works on parsed images, I wonder if this difference happens during image parsing - or it is the fact that images with less quality/detail take less time to recompress?

[ibgreen]

Also there are a few other GIF libraries out there that might perform better, e.g:

• gif.js
• gif.js-optimized

[ibgreen]

Mentioning in future tracker but closing due to inactivity.