Feb 22, 2022 08:00:00

To animate GIFs at the fastest speed, don't set the delay to the lowest value.

By

John Hobbs

GIF has the ability to display animation by incorporating multiple images into one file and displaying them in sequence, and is used as a simple way to embed movies on sites. In the animation function settings, you can specify the time it takes for the frames to change, but if you shorten the time to the limit of the specifications, the switching will actually become slower. Engineer Ben Phelps has summarized the reason in his blog. I am.

The Fastest GIF Does Not Exist
https://www.biphelps.com/blog/The-Fastest-GIF-Does-Not-Exist

There are two types of GIF specifications: GIF87a released in 1987 and GIF89a released in 1990, but only GIF89a supports animation and is the one that is widely used as of 2022. It is GIF89a. With the animation function of GIF89a, you can set the display time for each frame from '0' to '0xffff (65535 in decimal)' in units of 1/100th of a second. For example, if the value is '5', it will move to the next frame after 50ms, and if the value is the maximum value, '0xffff', it will take 655.35 seconds to move to the next frame.

If you check the GIF89a specifications , it clearly states 'if not 0' regarding the delay value, and if the delay is set to 0, it will not display correctly. The natural idea would be to set the delay to '1 (10ms)', but the GIF image with a delay of '1' is as follows.

On the other hand, when the delay is set to '2 (20ms)', the result is as follows.

This is because the browser restricts GIFs that are too annoying to flicker.For example, in Chromium, GIF images with a delay of 10ms or less will be overwritten with a delay of 100ms, as shown below.

Similarly, in Firefox, GIF images with a delay setting of 10ms or less will have a delay of 100ms. A comment in the source code also mentions what to do if a broken tool sets the delay to ``0'' as the default value.

In this way, in major browsers, delays of 10ms or less for GIF images are overwritten by 100ms, so in order to animate GIFs at the fastest speed, it is necessary to use a delay value of '2'.