Grab first frame more quickly with GIF stream

[benwiley4000]

It might be possible to automatically turn the first GIF frame into a data url with the help of gif-stream and pixel-stream - we could write the image data after the first frame has loaded to a canvas element, maybe with save-pixels, and extract the data url.

[olessavluk]

Should be possible to use this method to get first frame from gif - https://stackoverflow.com/a/4276742/3772379

[benwiley4000]

I already have a module I wrote for getting the first frame from a GIF: https://github.com/benwiley4000/gif-frames

The problem is that get-pixels doesn't fire its callback until the whole image is loaded. I wanted to stream the first frame then cut off the rest of the stream.

Looking at this again I think it's possible with this web-streams-node module which could let me convert that gif-stream into a WHATWG web stream, so I can pipe the fetch() body stream into it. I might try it out!

[benwiley4000]

I've got a proof-of-concept working here: https://codesandbox.io/embed/n15vp7r7wm

Need to figure out the best way to add that to the library... preferably not adding on too many kilobytes. It might be best to make it an optional add-on module.