Gifs embedded in posts paused after locally downloaded

Plunkett_Barry · January 27, 2021, 4:02pm

Hi,

I’m running into a problem embedding custom gifs (created with ScreenToGif) in Discourse posts. When I embed a gif, it works a moment then freezes on the first frame, e.g.:

It appears to work as expected in the post preview. And when I open the uploaded gif in a new tab, it works there too. It only freezes on Discourse itself.

I’ve tried four workarounds:

uploading the gif to another website (e.g. an S3 bucket), then linking to it. That works until the system bot comes along and downloads it locally, at which point it freezes again.
I also thought this might have something to do with resizing, so I tried removing the markdown formatting for the image, e.g.:
```
![](upload://4IHl8zz0sJiYl5Vm3H21YTEFo9z.gif) 
```
instead of:
```
![example|690x383](upload://4IHl8zz0sJiYl5Vm3H21YTEFo9z.gif) 
```
Since the gif worked when I followed the link to a new tab, I tried replacing the shorthand “upload” URI with the full URL of the uploaded image, e.g.:
```
![example|690x383](https://d11a6trkgmumsb.cloudfront.net/original/3X/2/1/211635b9ae2b0960e8e135299b3a91189b00c289.gif)
```
Finally, I thought the problem might have something to do with Discourse’s interpretation of the markdown code, so I tried using a raw html image tag with the full URL of the uploaded image:
```
<img src="https://d11a6trkgmumsb.cloudfront.net/original/3X/2/1/211635b9ae2b0960e8e135299b3a91189b00c289.gif">
```

Alas, nothing worked. If I controlled the forum where I wanted to post, I know I could disable local downloads. But alas, I don’t!

Falco · January 27, 2021, 3:12pm

Since it’s working here, but not on your site I suggest doing a rebuild of your site and trying again. We did lots of recent changes around gifs. For some periods we had bugs like your report and your site may be in an affected version.

Plunkett_Barry · January 27, 2021, 3:14pm

I don’t think that’s the problem. For me, it’s not working here. I can only see the first frame.

Is it possible there’s some other chrome default setting that’s getting in the way?

Falco · January 27, 2021, 3:20pm

Oh I can reproduce it on Chrome. So weird.

Original

Optimized via Gifscicle

After making it go via Gifscicle it works:

Plunkett_Barry · January 27, 2021, 3:20pm

Thanks for reproducing. What gifcicle command did you run to optimize?

Falco · January 27, 2021, 4:02pm

It’s a simple:

gifscicle original.gif -o fixed.gif

By the way Discourse ships with support for both autoplay mp4 and WEBP, that may give you better results!

Plunkett_Barry · January 27, 2021, 3:21pm

I don’t think it’s a file size thing because I’ve played with much larger and small gifs to no avail.

Plunkett_Barry · January 27, 2021, 3:22pm

Great let me see if this works for my actual gifs. I’ll update when I’m done.

Falco · January 27, 2021, 3:24pm

Definitely not a file size, but a “malformed” file that gifscicle is fixing. It’s common to see some tools making bad files. I always pass my GIFs to a good tool like ffmpeg before sharing. But even then you can get easily a malformed file if dimensions are odd, for example.

GIF is a complicated format, and there are better options nowadays like MP4 and WEBP for most applications.

Plunkett_Barry · January 27, 2021, 4:03pm

Worked for all my gifs. I also had to add the --colors 256 flag in some cases.

For anyone wondering, I generated the originally buggy gifs with ScreenToGif’s “Neural Network” gif generator.

Thanks for your help @Falco

zogstrip · January 27, 2021, 4:47pm

@nbianca any ideas why the GIF’s thumbnail isn’t animated? Seems like the original GIF is well within the limits

Falco · January 27, 2021, 4:48pm

It is animated on Firefox. It’s either a malformed GIF / Chrome bug.

zogstrip · January 27, 2021, 4:50pm

It’s not animated for me in latest FF / Windows 10.

Falco · January 27, 2021, 4:52pm

Interesting! Here is how it shows for me on Linux, Firefox on the left Chrome on the right:

nbianca · January 27, 2021, 4:57pm

All GIFs in this topic are animated for me (Chrome on Arch Linux), but current FastImage version says it is not animated because of this bug.

zogstrip · January 27, 2021, 4:59pm

In that case we should push to get that merged sooner rather than later

Plunkett_Barry · January 27, 2021, 5:13pm

For what it’s worth, I’ve found a couple cases where gifsicle doesn’t work. Specifically, sometimes using --colors 256 is required to get a working gif. But other times, leaving the flag out is necessary.

nbianca · February 2, 2021, 12:00pm

Hello,

The fix for your problem has been accepted and it is now available in the latest version.