libgif-js
libgif-js copied to clipboard
Use Uint8Array for more efficient loading of GIF frame data
This change results in an approximately 10x speedup when parsing large GIFs. This is accomplished by using Uint8Array
instead of binary strings, and using block memory allocators to increase memory efficiency/reduce GC load.
Using a basic for
loop instead of pixels.forEach()
to populate the canvas pixeldata also gave a significant performance boost.
Coincidentally I also implemented the same changes as #25 before realizing there was a pull request open for it, so +1 for that as well.
Doesn't appear this will ever get merged, but for anyone else using this branch the deinterlace
method also needs to be updated to use TypedArrays, something like:
var deinterlace = function (pixels, width) {
// Of course this defeats the purpose of interlacing. And it's *probably*
// the least efficient way it's ever been implemented. But nevertheless...
var newPixels = new Uint8Array(pixels.length);
var rows = pixels.length / width;
var cpRow = function (toRow, fromRow) {
var fromPixels = pixels.subarray(fromRow * width, (fromRow + 1) * width);
newPixels.set(fromPixels, toRow * width);
};
...
I haven't fully evaluated it or switched over, but https://github.com/gtk2k/gtk2k.github.io/blob/master/animation_gif/gifsparser.js seems to be a much cleaner and quicker way of parsing GIF frames, and it what A-Frame uses. libgif-js seems to be a dead project, and even with all the optimizations I've made it's still quite slow.
@jbaicoianu Does https://github.com/gtk2k/gtk2k.github.io/blob/master/animation_gif/gifsparser.js allow us to achieve the simple GIF pause / resume functionality? I didn't found any instructions on the repo.
How to get the total number of frames