APNG vs GIF. Which is Better?

Question

I have been using Gifs for those small loading images. Have been working great except the occasional transparency issues and 8 bit colors. Now I found out about the APNG recently. But don't know if i should be using it. Does it have enough browser support? And what about the file size. A large gif image already has large file size...

This question appears to be off-topic because it is about image formats, not programming. — Sergio Tulentsev, Jul 16 '14 at 07:10
I think it is part of web design process. Is Stackoverflow only for Programming questions? Then why are CSS and HTML questions here? — Ruchan, Jul 18 '14 at 06:32
From the help center: http://monosnap.com/image/OpFbGZgQcJvvjRQQ0YI0NhyopDAj1i.png — Sergio Tulentsev, Jul 18 '14 at 08:35
Why is this "opinion-based"? It is entirely possible to give an objective answer which discusses file size, image quality, and browser compatibility. Even if the latter is a moving target, an objective answer can describe when each browser did introduce support, and where one would look for more up-to-date information on browser support. — donquixote, Jan 31 '17 at 17:55
@jeffB as per the caniuse table in the top voted answer below IE (and Edge) does not seem to support apng — Catweazle, May 01 '19 at 18:00
@donquixote It is not about coding. I flagged it to be moved to Super User. — questionto42, Dec 28 '22 at 18:35

score 23 · Answer 1 · edited Jan 20 '18 at 09:41

23

I think APNG is better. As it supports 24-bit and 8-bit transparency. Moreover it is also supported by browsers like Mozilla Firefox, Chrome, Safari (see https://caniuse.com/#feat=apng).

edited Jan 20 '18 at 09:41

Nico Schlömer

53,797
27
201
249

answered Jul 16 '14 at 07:19

user3843763

259
2
5

7

As of March 14 2017, Chrome also supports APNG natively: https://chromium.googlesource.com/chromium/src/+/7d2b8c45afc9c0230410011293cc2e1dbb8943a7 – Augustin Mar 16 '17 at 18:27
2

As of April 29 2017, Chrome Beta adds support to animated PNG. Which hopefully will see full support of it by the time Chrome 59 is released. – Bilal Khoukhi Apr 30 '17 at 02:44
Is APNG also considered better in terms of performance and/or RAM usage? – android developer Nov 02 '21 at 19:22

LearningFast · Answer 2 · 2018-12-04T20:02:45.263

8

Animated PNG is better than GIF if we're focused on file size – achieving a smaller file size was one of the reasons the APNG format was designed. In this image comparison test data, you can see that APNG is smaller than GIF for every image.

There is more browser support now (June, 2016) than there was when this question was asked. iOS Safari now supports APNG (since version 8) – that's a pretty big user base. So you can serve APNG to Firefox desktop and Android, Safari desktop and iOS, and serve GIF to all other browsers.

Cory Dowdy has some good comparison data here, including animated webp as well.

UPDATE 2018-12-4: Chrome, Opera, and desktop Safari now support Animated PNG. This has been true for several months.

edited Dec 04 '18 at 20:02

answered Jun 19 '16 at 12:40

LearningFast

1,163
13
13

The differences in file size between APNG vs GIF are only 10% though...hmmmm. I suppose reducing the total web traffic in the world by 10% would be significant. – btomtom5 Nov 30 '18 at 07:08
What about other factors that can be compared between them? Is decoding (and encoding, but less interesting) APNG faster than GIF? Or take less memory? – android developer Nov 02 '21 at 19:24

score 5 · Answer 3 · answered Oct 07 '14 at 06:48

5

Apng is a better format. GIF and apng are both lossless, but apng tend to be smaller, and better quality (more colors, and the ability for transparency) Unfortunately apng are largely unsupported, but that may change. Hopefully apng catches on.

answered Oct 07 '14 at 06:48

colt

59
2
1

2

Ehem... GIF is not losless. For animation only supports a pallet of 256 colors per frame. – Henrik Sommerland Mar 21 '17 at 15:26
3

GIF is lossless for a 256 color image. JPEG would not be lossless even on 256 colors. But for logos with usually less than 256 colors, GIF has been used for a long time as lossless alternative, because JPEG softened the edges. – Trendfischer Jul 04 '17 at 14:18

Matthew Haugen · Answer 4 · 2019-01-20T06:28:20.233

-9

Times have changed, please see below answers!

I'd definitely stick with GIF. I hadn't heard of APNG before, but from my research now, it sure sounds like it's almost unanimously unsupported. It sounds like Internet Explorer and Chrome don't support it, and that just seems useless for most users. Even if it is supported and my research on that was wrong, it's still only the most recent version or two that would. And for something where there's a very viable alternative, I'd hardly consider that risk to be worth it. And I know for a fact that my, latest version of IE didn't work with any of the example APNG files I came across.

It might be nice in a few years when/if it catches on, but for now it's just not a good idea.

edited Jan 20 '19 at 06:28

answered Jul 16 '14 at 07:12

Matthew Haugen

12,916
5
38
54

4

FYI, there's more browser support now, particularly iOS Safari and Mac Safari. APNG yields smaller files than GIF, so it might be worthwhile for high traffic sites – basically, the same scenarios where people go to the trouble to serve WEBP or JPEG-XR to the subset of browsers that support those formats (Chrome, IE 11, Edge, etc.) – LearningFast Jun 19 '16 at 12:43
13

As of March 14 2017, Chrome also supports APNG natively: https://chromium.googlesource.com/chromium/src/+/7d2b8c45afc9c0230410011293cc2e1dbb8943a7 – Augustin Mar 16 '17 at 18:27
6

GIF is so limited that I'd drop it. Now all browsers support APNG. We better start taking advantage of that. – Royi Aug 28 '17 at 15:49

APNG vs GIF. Which is Better?

4 Answers4