The GIF (/ɡɪf/ GHIF) file is unfortunately the most popular and widespread form of exchanging animated content across the internet.
Oh crap here’s one now
A Pokémon I 3D modeled and animated called Shuppet, in
50fps
When I am making animations, with the intent of ultimately becoming a GIF file on the internet, I pretty much always target 50 fps. 50fps
is currently the highest and most compatible frame rate supported by most modern browsers such as Chrome and Firefox. Currently(Sun 09 Feb 2020 09:01:05 AM PST
) these are some of the maximum frame rate GIFs that some key software and browser engines support to my knowledge. I’ll try my best at keeping this updated, but based on some of the bug tracker replies I’ve been seeing, these values probably aren’t going to be changing any time soon.
Software | Highest frame rate |
---|---|
Chrome(Blink) | 50fps |
Firefox(Gecko) | 50fps |
Safari(Webkit) | 50fps |
Opera(Blink) | 50fps |
Internet Explorer 10(Gecko) | 50fps |
IrfanView | 100fps |
Desktop image viewers such as InfranView are not
limited by the constraints of serving web pages and tend to display gifs at
their actual fps(Probablt the only way to properly see a 100fps
gif!). Meanwhile web browsers(As in, their browser engines: WebKit, Gecko, Blink, etc) have to consider all the other content that a web page can be displaying and would rather not choke a UI thread trying to handle dozens of 100fps
asynchronous animating gifs. The highest that most browsers worth their weight is 50fps
as of the year 2020.
GIF file format specification
7 6 5 4 3 2 1 0 Field Name Type +---------------+ 0 | | Extension Introducer Byte +---------------+ 1 | | Graphic Control Label Byte +---------------+ +---------------+ 0 | | Block Size Byte +---------------+ 1 | | | | | <Packed Fields> See below +---------------+ 2 | | Delay Time Unsigned <<<<<<<<<<<< +- -+ 3 | | +---------------+ 4 | | Transparent Color Index Byte +---------------+ +---------------+ 0 | | Block Terminator Byte +---------------+
vii) Delay Time - If not 0, this field specifies the number of hundredths (1/100) of a second to wait before continuing with the processing of the Data Stream. The clock starts ticking immediately after the graphic is rendered.
Any gif that claims to be showing 60fps
is simply untrue due to the fact that no web browser out there right now supports displaying gifs higher than 50fps
. If you try to set your frame rate any higher than what the browser supports (or if you set the frame delay to zero) then most browsers will default to a playback of 10fps
(over 5 times slower than you probably intended).
Not only that, but you can’t even depict the 60fps frame-delay(0.016666...
) by the gif89a specification since you can
only depict frame-delays in increments of 0.01
(1/100 of a second, 0.01
, 0.02
, 0.03
, 0.04
, …) so it simply does not have the resolution to depict the frame delay of 0.016666...
necessary to get true 60fps
. You can either alias 0.01666...
to 0.01(and ultimately get 10fps
in web browsers since it is lower than 0.02
) or set the frame-delay to 0.02 and get a proper 50fps
depiction(which is the best you’re gonna get).
If there’s something to take away from this it’s:
GIFs are incapable of depicting
60fps
. The two highest FPS that can be depicted with a GIF is either100fps
or50fps
GIFs with a frame-delay lower than
0.02
(faster than50fps
) is going to be forced to play at10fps
by all web browser engines!
I made this set of gifs of the same animation at different frame rates in ascending order(fps gets progressively higher). If any of them take a different amount of time to reach the start and end points(they are all exactly 1 second long) then you know what framerate your browser is “restricting” the frame delay at.
Technically
8.33333…fps
(0.12s
)
Technically
12.5fps
(0.08s
)
Technically
16.666666…fps
(0.06s
) This seems to be the “sweet spot” portable frame rate that most all browsers will minimally support if you care about your GIFs working on… NetScape or something
Technically
25fps
(0.04s
)
technically
33.33333…fps
(0.03s
)
Nice and even
50fps
, even technically! (0.02s
)This is the framerate I work with as it is nice and evenly representable within the GIF specification and is a very high frame rate that most modern browsers support. This is the best you’re gonna get with
.gif
files.
This is pretty much just 50fps(0.02) again as it is only possible to represent frame delays by increments of
0.01
and software such as Photoshop will round-off the frame delay from0.01666...
to0.02
I put this here to prove a point since some software will lead you to believe that you are exporting a
60fps
GIF when it is actually not possible.
The highest fps possible representable in the GIF file format specification is
100 fps
(0.01s
), which no browser supports and60hz
consumer screens cannot faithfully display this anyways. Browser-engine image decoders will automatically reset this framerate to 10fps and play it x10 times slower. If this gif is moving very slow to you, it is because your browser reset the speed to10fps
.