APNG相對於GIF有哪些優勢？

01-02

GIF一直以來的特點就是以動態顯示為主，為了更好地在網路上傳播，它需要犧牲質量來降低體積，圖像信息比較多的情況下，顆粒感很明顯。APNG是普通png圖片的升級版，它的後綴依然是.png，包含動態的情況下體積會比普通靜態png打出數倍，可以做到無損的情況展示動態。

下圖展示的就是在有色背景下兩個格式圖片的顯示效果

應該是體積難以控制的原因，不像GIF那樣普及，能夠接觸到的應用範圍有搜狗輸入法的動畫皮膚（flash除外），還有LINE的動態貼圖。2016.7.6

補充

目前iOS10信息iMessage中的各種動態表情使用的即使apng格式，可以在Safari瀏覽器中打開播放。

簡介

GIF 是一個非常古老的格式，1987 年誕生，最後一個版本是 1989 年。（這就是為什麼 GIF 文件頭的 magic number 是 GIF89a）

APNG 相對新一些，是 Mozilla 在 2004 年推出的，十幾年的科技進步是不容小覷的，所以 APNG相對於 GIF 的優勢十分明顯，後面會分析。APNG 格式是 PNG 的擴展，第一幀儲存方式和普通的 PNG 一樣在 IDAT 區段中，APNG 只是新增了三種區段，所以如果一個軟體只支持 PNG 而不支持 APNG 的話，依舊可以顯示出圖片的第一幀，只是不能動罷了。

APNG 新增的三種區段分別為：

acTL (animation control) 用來存放幀數和播放次數，整個文件只有一個區段
fcTL (frame control) 用來存放每一幀的高、寬、位置、延時等信息，每一幀一個區段
fdAT (frame data) 用來存放除了第一幀以外後面每一幀的圖片數據，採用 Deflate 壓縮，每一幀一個區段

這裡稍微提一下 WebP，Google 在 2010 年推出的全部通吃的圖片格式，為什麼叫全部通吃呢？因為他既可以有損（替代 JPEG）也可以無損（替代 PNG），還可以動（替代 GIF），並且在壓縮率上全面超越了這三種常用的格式。

壓縮率

GIF 採用的是 LZW，而 APNG 採用的是 Deflate，再加上 APNG 繼承了 PNG 的 filter，利用相鄰像素的相似性使壓縮率大大提高，詳見我關於 PNG 的答案

就以下面這個 Wikipedia 頁面的 GIF 為例吧（知乎不支持動圖。。。原圖見https://commons.wikimedia.org/wiki/File%3ARotating_earth_(large).gif）

原 GIF 文件大小為 1.36 MB，但是一般的 GIF encoder 都不會拚命的去優化文件大小。

如果讓 gifsicle 利用各種奇淫技巧進行優化，可以將文件無損的壓縮到 978 KB

gifsicle -O3 Rotating_earth_(large).gif -o Rotating_earth_(large)_gifsicle.gif

而隨隨便便轉換一個 APNG 才 826 KB 而已

gif2apng Rotating_earth_(large).gif

如果不在乎壓縮時間的話，使用奇淫技巧（zopfli）來壓縮 APNG，還可進一步壓縮到 811 KB

gif2apng -z2 Rotating_earth_(large).gif

而如果無損轉換成 WebP 的話，只有 767 KB

gif2webp -min_size Rotating_earth_(large).gif -o Rotating_earth_(large).webp

如果允許有損的話（肉眼看不出區別），WebP 只有 199 KB！！！

gif2webp -min_size -lossy Rotating_earth_(large).gif -o Rotating_earth_(large)_mixed.webp

這裡使用了 -lossy 來壓縮有損，實際上 WebP 還支持 -mixed，可以每一幀根據壓縮體積單獨選擇有損或者無損，但是由於這個圖片更適合有損所以這裡沒有用 -mixed。

將上面的數據做了個圖表，大概是這樣子的（由於樣本數僅為 1，本測試及其不科學，結果僅供參考）

顏色

GIF 每個像素只有 8 bit，也就是說只有 256 種顏色，於是很多人誤以為 GIF 不支持 24 bit RGB，但實際上，GIF 的限制是每一幀最多只能有 256 種顏色，但是每種顏色可以是 24 bit 的。不過即使是這樣，256 種顏色還是太少了，這就導致了 GIF 的畫質都比較差。

而 APNG 和 WebP 則完全沒有這方面的限制。

透明

GIF 雖然也支持透明，但是他只支持將某個顏色標記成透明，也就是說他不支持半透明，只支持完全透明或者完全不透明。如果把一個邊緣是半透明的圖片轉換成 GIF，就會出現另一個答案中提到的雜邊問題。

而 APNG 和 WebP 都支持 8 bit alpha channel，透明度可以有 256 級。

兼容性

這可能是 GIF 唯一的優勢了吧。

幾乎所有的瀏覽器都支持 GIF，而支持 APNG 的瀏覽器只有 Firefox 和 Safari，據說 Chrome 58 開始也會支持 APNG，目前支持 WebP 的只有 Chrome 和 Opera，據說 Firefox 也即將支持 WebP，據說 Safari 也在測試 WebP 的支持。至於 IE 和 EDGE 嘛，呵呵，還是換瀏覽器吧。

1.支持全彩和透明(最重要)

2.向下兼容PNG

3.無專利問題(之前GIF的LZW演算法有專利限制)