| 圖片格式 | 支持透明 | 動畫支持 | 壓縮方式 | 浏覽器支持 | 相對原圖大(dà)小(xiǎo) | 适應場景 |
|---|---|---|---|---|---|---|
| baseline-jpeg | 不支持 | 不支持 | 有損 | 所有 | 由畫質決定 | 所有通用場景 |
| progressive-jpeg | 不支持 | 不支持 | 有損 | 所有 | 由畫質決定 | 所有通用場景, 漸進式加載 |
| gif | 支持 | 支持 | 無損 | 所有 | 由幀數和每幀圖片大(dà)小(xiǎo)決定 | 簡單顔色，動畫 |
| png | 支持 | 不支持 | 無損 | 所有 | 由png色值位數決定 | 需要透明時 |
| webp | 支持 | 不支持 | 有損 | Chrome、Opera | 由壓縮率決定 | 複雜(zá)顔色及形狀，浏覽器平台可預知(zhī) |
| apng | 支持 | 支持 | 無損 | Firefox、Safari、iOS Safari | 由每幀圖片決定 | 需要半透明效果的動畫 |
| svg | 支持 | 支持 | 無損 | 所有(IE8以上) | 由内容和特效複雜(zá)度決定 | 簡單圖形，需要良好的放(fàng)縮體(tǐ)驗，需要動态控制圖片特效 |
| bpg | 支持 | 支持 | 有損 | 不支持，需要js解碼 | 由畫質決定 |
jpeg上需要極限優化的場景 |
下(xià)一(yī)篇 如何清除YUNDUN CDN緩存？
上一(yī)篇： 響應式網站設計原則