图片压缩-小心得

图片压缩

矢量图与位图

• 矢量图-完美的几何图形

• 矢量图也称为面向对象的图像或绘图图像，是通过一些基本图形元素，如点、线、面，边框，填充色等通过数学公式计算方式来显示的描述图形。例如，描述一个圆通过其圆心位置和半径，通过边框粗细、颜色及填充色等描述其样式。电脑在显示时通过这些数据绘制出定义的图像。

• 特点：文件容量较小，且缩放不失真。

• 缺点：是无法表现自然界真实场景。

• web页中的图像都是位图，即便有些矢量图形，也是用矢量工具绘制后转成的位图格式。

• 位图-神奇的拼图

• 位图又叫点阵图或像素图，计算机屏幕上的图你是由屏幕上的发光点（即像素）构成的，每个点用二进制数据来描述其颜色与亮度等信息，这些点是离散的，类似于点阵。多个像素的色彩组合就形成了图像，称之为位图。

• 对比

  图像类型	组成	优点	缺点	常用制作工具
  矢量图	数学图元	文件容量较小，在进行放大、缩小或旋转等操作时图象不会失真	不易制作色彩变化太多的图象	常Illustrator、Flash、CorelDraw等
  位图	像素	只要有足够多的不同色彩的像素，就可以制作出色彩丰富的图象，逼真地表现自然界的景象	缩放和旋转容易失真，同时文件容量较大	Photoshop、画图等

位图图片格式

• 图片有很多的格式，包括PNG、JPEG、JPG、BMP、GIF、TIFF等。参考图片格式详解

BMP 格式（*.bmp）

• 最主要特点：Windows 环境中运行的图形软件都支持bmp图像格式
• 优点：
  • 1.保证了图像的质量
  • 2.是一种与硬件设备无关的图像文件格式，使用非常广
• 缺点：
  • 1.它采用位映射存储格式，除了图像深度可选以外，不采用其他任何压缩比，文件体积较大

JEPG 格式（*jpg;jpeg）

• 特点：最常用的图像文件格式，由软件开发联合会组织制定，是一种有损压缩格式
• 缺点：图像中偿付或不重要的资料会被丢失，造成图像数据的损伤。
• 优点：
  • 1.JPEG运用有损压缩方式去除冗余的图像数据，在获得极高的压缩率的同时能展现十分丰富生动的图像，即用最少的磁盘空间得到的较好的图像品质
  • 2.JPEG是一种很灵活的格式，具有调节图像质量的功能，主持多种压缩级别，在10:1到40:1 之间，压缩比越大，品质就越低
  • 3.JPEG格式压缩的主要是高频信息，对色彩的信息保留较好，适合应用于互联网，可减少图像的传输时间，可以支持24bits真彩色，也普遍应用于连续色调的图像
  • 4.JEPG格式应用非常广泛，特别是在网络和光盘读物上，目前各类浏览器均支持JEPG这种图像格式，因为JEPG格式的文件尺寸较小，下载速度快。

GIF（Graphics Interchange Format）原意是“图像互换格式” 格式（*.gif）

• 特点：
  • 1.GIF最多支持256种色彩的图像，在一个GIF文件中可以存放多幅彩色图像，把存入一个文件中的多幅图像数据逐幅读出来并显示到屏幕上，就可构成一种最简单的动画。
  • 2.GIF图像文件的数据是经过压缩的索引图

TIFF格式（标签图像文件格式*.tif;*.tiff）

• TIFF(TagImageFileForamt)图像文件是由Aldus和Microsoft公司为桌上出版系统研制开发的一种较为通用的图像文件格式。
• TIFF格式灵活易变。它又定义了四类不同的格式：
• TIFF—B适用于二值图像。
• TIFF_G适用于黑白灰度图像；
• TIFF—P适用于带调色板的彩色图像
• TIFF_R适合用于RGB真彩色图像。
• TIFF支持多种编码方法，其中包括RGB无压缩、RLE压缩及JEPG压缩等。
• TIFF是现存图像文件格式中最复杂的一种，它具有扩展性，方便性，客观性，可改性，可以提供给IBMPC等环境中云心，图像编辑程序。
• TIFF图像文件由三个数据结构组成，分别为文件头、一个或多个称为IFD的包含标记指针的目录以及数据本身。
• TIFF主要用于印刷。

PNG（Portable Networf Graphics）原名称为“可移植性网络图像”格式

• 优点：它支持alpha通道，即透明度，可以做成半透明的图片。
• 缺点：由于PNG非常新，所以目前并不是所有的程序都可以用它来存储图像文件。

位图存储方式-bmp

• 查看数据软件Synalyze It! Pro
• 参考BMP位图格式的内存存储方式
• bmp文件头(bmp file header)：提供文件的格式、大小等信息
• 位图信息头(bitmap information)：提供图像数据的尺寸、位平面数、压缩方式、颜色索引等信息
• 调色板(color palette)：可选，如使用索引来表示图像，调色板就是索引与其对应的颜色的映射表
• 位图数据(bitmap data)：就是图像数据啦
• 512 * 512 * 4 + 54 = 1048576 + 54 = 1048630 + 2 = 1048632 ~= 1M

图片压缩–有损压缩和无损压缩

• 无损压缩
  • 是对文件的数据存储方式进行优化，采用某种算法表示重复的数据信息，文件可以完全还原，不会影响文件内容，对于数码图像而言，也就不会使图像细节有任何损失。
  • TIFF.GIF.PNG
• 有损压缩
  • 是对图像本身的改变，在保存图像时保留了较多的亮度信息，而将色相和色纯度的信息和周围的像素进行合并，合并的比例不同，压缩的比例也不同，由于信息量减少了，所以压缩比可以很高，图像质量也会相应的下降。
  • JPEG. JPG
• 因为JPG是有损压缩，PNG是无损压缩，所以JPG一定比PNG小？

JPEG. JPG

• JPG是JPEG的简写，jpg是后缀名，jpeg既可作为后缀名，又能代表文件格式。
• 保存的时候建议用JPG， 一些特殊的操作系统不支持三个字符以上的后缀名。
• 对原始图像信息进行JPEG编码的过程就分为两大步：
• 第一步，去除视觉上的多余信息，即空间冗余度；
• 第二步，去除数据本身的多余信息，即结构冗余度。
• 压缩原理
• DCT离散余弦变换
  对于二维灰度图像进行DCT变换，就能得到图像的频谱图：低阶（变化幅度小）的部分反映在DCT的左上方，高阶（变化幅度大）的部分反映在DCT的右下方。由于人眼对高阶部分不敏感，依靠低阶部分就能基本识别出图像内容，所以JPEG进行压缩的时候，基本上只存储DCT变换后的左上部分，而右下部分则直接丢弃。原文链接
• 哈夫曼算法
• 压缩比率通常在10：1到40：1之间，压缩比越大，品质就越低；相反地，压缩比越小，品质就越好。

PNG

• 数据存储方式
• png数据存储解析
• 索引图与RGB图
• 对于PNG图像，可以分为索引（Index）图和RGB图两种，索引图只包含固定数量的颜色，而RGB图的颜色数量是不受限制的。
• RGB图的每一个象素都保存一个RGB值，代表这个象素的颜色，因此，一张RGB图有多少个象素，文件中就保存多少个RGB值。
• 索引图会将其固定数量的颜色，按照顺序排列起来，作为颜色的索引保存在文件头中，被称为调色板(palette)。每一个象素只保存其颜色在调色板中的索引。
• 因此，对于一般的PNG图，索引图文件的大小总是小于RGB图的。
• 存储区别
• 行程压缩原理
• 当我们把一张索引图的所有象素（N个），按照从上到下，从左至右，即按行扫描的顺序排列起来的时候，我们得到一个队列。如果我们用1个字节来存储一个象素的索引值（调色板颜色不超过256），那么数据的大小为N字节。这段数据的格式我们表示为[I1][I2]…[In] 共N个。
• 在上面的队列中，可能会出现很多连续相同的索引值，最多的就是透明色。如果我们在每个索引值前用1个字节保存这个值连续出现的数量（最多可以表示256个），那数据的格式变为[C1][I1][C2][I2]…[Cm][Im]共M个。那么一张256个象素的单色图的所有数据，只需要2个字节来保存。通常，我们所需的图中总是有大片连续的颜色，包括透明色，因此按照这个格式保存的图像，其文件大小可以大大降低，这就是行程的压缩原理。
• IDat数据块压缩原理-PNG文件采用LZ77算法的派生算法进行压缩，其结果是获得高的压缩比，不损失数据。它利用特殊的编码方法标记重复出现的数据，因而对图像的颜色没有影响，也不可能产生颜色的损失，这样就可以重复保存而不降低图像质量。
• LZ77算法实现
• 压缩过程
• 预解析（Prediction）
• 渐变色图片、颜色值变化不大并且颜色单一的图片更容易压缩的原理。
• 差分编码的目的，就是尽可能的将png图片数据值转换成一组重复的、低的值，这样的值更容易被压缩。
• 最后还要注意的是，差分编码处理的是每一个的像素点中每条颜色通道的值，R（红）、G（绿）、B（蓝）、A（透明）四个颜色通道的值分别进行处理。

PNG8和PNG24以及PNG32的区别

• PNG,JPEG,BMP,JIF图片格式详解及其对比
• PNG、JPEG、BMP等几种图片格式详解

TinyPng

• ​PNG图片压缩对比分析
• TinyPng官网
• 把相似像素的24bit位用8bit位来表示，并且移除了不必要的元数据，是有损压缩，肉眼很难看出来。

pngquant

• pngquant是一款PNG压缩器，通过将图像转换为具有alpha通道（通常比24/32位PNG文件小60-80％）的更高效的8位PNG格式，可显著减小文件大小。 压缩图像完全符合标准，并受所有Web浏览器和操作系统的支持。
• 只对png进行压缩
• pngquant对比TinyPng
• Quantization技术将若干个标量数据组构成一个矢量，然后在矢量空间给以整体量化，从而压缩了数据而不损失多少信息。

ETC1

• ETC1压缩纹理格式详解
• ETC1算法的深入了解
• 压缩比是固定的48/8=6
• 至于常用的把ARGB分别存储为两张ETC1纹理的做法，压缩比是64/16=4。
• cocos2dx对ETC1的支持

总结

• 矢量图与位图的区别
• bmp、png图片的结构
• 无损压缩和有损压缩的区别
• JPEG的压缩原理
• png的压缩原理
• PNG8和PNG24以及PNG32的区别
• TinyPng的压缩原理
• 压缩工具pngquant
• 压缩格式android是ETC1，ios是PNG