图片大类
一、位图（BMP）
BMP取自英文单词 Bitmap，翻译为‘位图’。是XP或者更早之前的Windows使用的图片格式。
位图特征：存储每个像素，没有压缩。
那么什么是像素？
把照片放大可以看到一个个格子，这些格子就是像素，像素在计算机中用二进制来表示。举个例子，如果一个像素用一位二进制数表示，能有多少种颜色呢？
答：两种，一个二进制位，要不放 0（表示黑色），要不放 1（表示白色）。即n个二进制位有2^n种颜色。
位图的常见类型
首先理解几个概念
无压缩
无压缩的图片格式不对图片数据进行压缩处理，能准确地呈现原图片。BMP格式就是其中之一。
无损压缩
压缩算法对图片的所有的数据进行编码压缩，能在保证图片的质量的同时降低图片的尺寸。png是其中的代表。
有损压缩
压缩算法不会对图片所有的数据进行编码压缩，而是在压缩的时候，去除了人眼无法识别的图片细节。因此有损压缩可以在同等图片质量的情况下大幅降低图片的尺寸。其中的代表是jpg。
1、gif
- 无损压缩
- 相比bmp格式，尺寸较小
- 支持透明和动画
- 缺点是由于gif只存储8位索引（也就是最多能表达2^8=256种颜色），色彩复杂、细节丰富的图片不适合保存为gif格式。
适用于色彩简单的logo、icon、线框图
2、png-8 /png-24
- 无损压缩，基于8位 / 24位索引色的位图格式。
- png-8相比gif对透明的支持更好，同等质量下，尺寸也更小。非常适合作为gif的替代品。
- 缺点是png-8不支持动画。这也是png-8没办法完全替代gif的重要原因。如果没有动画需求推荐使用png-8来替代gif。
3、jpeg / jpg
- 有损压缩
- 体积小，加载速度快
- 缺点是不支持透明度
二、矢量图
svg
- SVG（可缩放矢量图形）是一种基于 XML 语法的图像格式。
- 文件体积更小，可压缩性更强。
- 无限放大不失真。因为SVG对图像的处理不是基于像素点，而是是基于对图像的形状描述。
- 缺点：一方面是它的渲染成本比较高，这点对性能来说是很不利的。另一方面，SVG 存在着其它图片格式所没有的学习成本（它是可编程的）。
