pornel 6 years ago

Author here: yes, please use 21st century codecs whenever you can.

This is intended only for interoperability. There are sites/apps that take "GIF" too literally and don't allow uploads of efficient formats. If you need to share a GIF now you can waste bandwidth at least without ruining the quality.

I wrote this only because most encoders make GIFs look awful, as if nobody upgraded the encoders since '90s. This one uses pngquant, which takes quantization very seriously. Plus it guides pngquant to put more weight on pixels seen longer on screen, avoids creating redundant colors which can be reused from previous frames, and does dithering across frames, which "patches" previous frames as neatly as possible. Overall it gives anims with 1000-3000 colors per frame.

It's written in Rust and does decode/convert/encode in parallel, because it was fun to do.

If you want smaller GIFs, I also wrote another compressor with opposite quality/size trade-off: https://kornel.ski/lossygif (or use WebM!)

  • aw3c2 6 years ago

    Very cool projects indeed!

ronjouch 6 years ago

gifski is awesome and, be careful, produces big GIFs.

Linux users, it's available in peek, a very usable GNOME-ish screencasting tool. https://github.com/phw/peek/issues/212

  • nolok 6 years ago

    What would be the use case of this versus WebM ?

    • ronjouch 6 years ago

      For me, due to GitHub/BitBucket restrictions. When spitting a piece of frontend code, I like to help my fellow reviewing collea^H^H^H^H^Hvictims with a little screencast of what my code ends up looking like, typically ten seconds of me clicking around the new feature.

      GitHub/BitBucket (as of today) won't let me embed a webm/mp4 to a comment field in a Pull Request, but supports drag&dropping a GIF and displaying it inline, so GIF it is for now ¯\_(ツ)_/¯. Maybe our GitHub & Atlassian overlords will see the light at some point in the future, hopefully before the end of our year 1998. I see one intrinsic valuable feature in GIF today: the guarantee that there will be no sound (and even this is kinda moot, an mp4/webm video can be embedded muted by default). Other than that, I agree, it's a shame not to use a better format.

aw3c2 6 years ago

With WebM I see no reason to use actual GIF anymore. It is such a waste of bandwidth and processing power.

  • dilap 6 years ago

    Sadly the UX that ends up being afforded by video-decoders is never quite as seamless and nice as plain-ol-gif -- the video expands to its own window, rather than playing immediately; sometimes you get playback controls; very often the looping is not seemless; you can't just copy-and-paste the video to share it with a friend...

    • tenryuu 6 years ago

      At least videos have these options of pausing and looping.

      Gifs generally don't pause unless you have some hacks, let alone looping in gifs is a hard coded value within the image, meaning it's entirely optional, but within the export process.

      This is almost nothing compared to the savings you make in download times though. Video is a much more modern solution, that's why imgur transcode all their large gifs to webm+mp4

      • dilap 6 years ago

        options of pausing and looping are not good things when it comes to small animated clips ("gifs").

        basically real video wins on download size and loses at everything else for this use-case.

        but sites keep transcoding to mp4 because it keeps their bandwidth costs down. users don't care -- most internet is plenty fast enough to download even large gifs super fast.

ttoinou 6 years ago

How does it compare to ffmpeg gif encoder ? Can it be used to compress well gif too ?

How can it support thousands of colors, I thought GIF was limited to a 256 colors palette ?

  • pornel 6 years ago

    The quality is much higher than ffmpeg. Encoding is slower.

    GIF works like a canvas that can be painted on with 256 colors at a time. This encoder takes care to reuse existing colors on the canvas as efficiently as possible.

    Also most encoders generate ugly palettes (e.g. for a start throwing out 3 of 8 bits of precision) and use naive dithering.

    This one spends so much effort on getting optimial palettes, that if I were to get VC funding for it, I'd say it does machine learning.

    • ttoinou 6 years ago

        This one spends so much effort on getting optimial palettes, that if I were to get VC funding for it, I'd say it does machine learning. 
      
      Lol

      Maybe we could turn this into a product together. Videographers like making GIFs.

  • fivesigma 6 years ago

    >How can it support thousands of colors

    Temporal dithering. Also called FRC - frame rate control.

    You might not notice it, but if you are on a TN monitor right now (almost all non-professional monitors) this technique is being used to emulate 24 bit color. Most TN panels can only display 6 bits per channel.

    • ttoinou 6 years ago

      How cool ! That's why the GIF are so heavy it must be something like 100 FPS

frik 6 years ago

Great image quality!

Definitely better a lot than ffmpeg with palette option. (are there other gif tools, how do they compare?)

GIF format may be really dated, but it's really light on resources.

I learned the hard way that playing dozens of small short MP4 video clips on a web page will chock your (mobile) browser, but displaying the same clips as GIF is no problem at all.

Edit: I wrote "dozens of clips", if you don't believe me, try it out yourself, and no video codecs like MP4 are more hardware intensive if your smartphone/tablet graphic card has to render more than a few.

  • explodingcamera 6 years ago

    Be careful, Gif browser performance can often be way worse than webm's, webp's or even mp4s. Sites like for example imgur switched to other formats by default...

  • ttoinou 6 years ago

    And color accuracy seems better with GIF also

    • cooper12 6 years ago

      Uhh, GIF only supports 256 colors per frame. I'm not sure what you mean. "Accuracy" of color is more affected by monitor calibration than the actual format (ignoring embedded color profiles used by photographers).

      • ttoinou 6 years ago

        I don't know about WebM VP9 but with H264 colors are often in the 16 - 235 range. I can spot in a webpage when it's a video and not a GIF because colors are washed out and can't be as saturated as with GIF

        • pornel 6 years ago

          "Washed out" is not a fault of H.264 per se, but video decoders being awful at color management. Most common errors are lack of gamma correction for Rec 709 and assuming that less-than-HD videos are in ill-defined BT 601 color space.

          There's also a lesser problem of chroma subsampling destroying fine saturated details. WebM/VP9 supports full-res chroma.

          • ttoinou 6 years ago

            I agree but the fact stay the same : you put a H264 video and a GIF in a webpage, most of the time you get better colors with the GIF.

            (H264 also has 444 by the way)

        • mrob 6 years ago

          What browser are you using? I just tried this with a 0x00 to 0xff linear gradient ( https://www.imagemagick.org/image/gradients/linear_gradient...., duplicated so I have two frames) encoded to MPEG levels (16 to 235) 8-bit h264.

              ffmpeg -r 30 -f image2 -i linear_gradient%02d.png -vcodec libx264 -preset slow -crf 22 -pix_fmt yuv420p -start_number 1 -vframes 2  linear_gradient.mp4
          
          Firefox stretches it to 0x01 to 0xfe, and introduces obvious banding in the process. MPV does the same thing, although it has an optional debanding filter. The black and white levels are only a single unit off from the original, so I doubt I'd notice in real video. The banding is a much bigger problem (solved by 10-bit color spaces), but GIF has more banding in general use.
          • ttoinou 6 years ago

            Yeah I made some more tests with a full RGB color image and a youtube uploading and everything is fine now.

            I'm pretty sure there was trouble some time ago though.... (It was with another computer. There's a lot of things that can introduce color shifts : video platform encoding, browser decoding, graphic card drivers / configuration etc.)

            Thanks for the comment

        • cooper12 6 years ago

          Hmm, I guess our experiences are just different then. Personally I've never noticed much amiss in online videos, aside from low bitrate. Meanwhile, I can tell gifs apart right away because of banding, overt dithering, and generally diminished quality. I also do photography as a hobby so I'd like to think I'd be sensitive to color issues, but it's possible I'm just not looking for it.