TRTC案例：截图体积与清晰度
原创
背景：
业务场景和架构：TRTC安卓端与小程序端实现视频互通，房间旁路到直播，采用直播云端截图。
本文旨在透过一个常见的case，尽量简单通俗的梳理下关于图片的基础知识，后续精力允许会出关于色彩、图像的解析系列。
问题：
采用这种方式获得的截图，体积很小且清晰度较差，不适用与需要高清截图的场景。为什么同样尺寸的照片清晰度和体积差那么多，业务上该如何实现高清截图。
分析解决方案：
问题1：如何有效调整分辨率
这里各端直接使用SDK提供的调整分辨率接口即可。
以Android端为例，可以在setVideoEncoderParam是传入TRTCVideoEncParam中，指定videoResolution。
问题2：为什么同样分辨率的图片，大小和质量不一样
下图是一张基本图片信息的对比图，左边的照片是采集端上行音视频时候抓到的截图，右边的照片是采用旁路直播后，在云端截图中取出来的照片。可以看出左边照片的文字清晰度是明显高于右边照片文字清晰度的。
最右侧的两张图中可以看到，两张照片的分辨率基本一致。那么，为什么同样分辨率的两张照片，清晰度会有那么大的差别的呢，一张图片是2M而另一张只有150kb？下面分3个部分展开做阐述：
PART1:常见图片格式与对比
图片是指由图形、图像等构成的平面媒体。图片格式是计算机存储图片的格式，常见格式包括jpeg,png,bmp,gif,pcx,tga,exif,fpx,svg,psd,cdr等。
图片的格式多种多样，总体上可以分为点阵图(位图)和矢量图两大类；常见的BMP、JPEG、PNG等格式都是点阵图形，而SVG、SWF等格式的图形属于矢量图形。
那点阵图和矢量图有什么区别呢，通俗的将，点阵图是由最小单位为像素构成的图，缩放会失真；而矢量图是采用线条和填充的方式构成，缩放不会失真的图。
PNG/JPEG/BMP格式的简单对比：
为了描述组成图像的像素色彩信息，需要知道图像的长、宽像素、像素位深等信息。而为了规范图像的信息和像素数据，衍生出不同的图像文件存储格式，常见的如BMP、PNG、JPEG等，下面分别对这三种格式做简单对比。
PNG（Portable Network Graphics）为可移植网络图形格式，也是一种位图文件存储格式，可以进行无损压缩，
PNG格式因其支持透明的属性是网页中广泛使用的一种格式。通常，png格式图片的大小是jpg图像大小的数倍
PNG格式有8位、24位、32位三种形式，其中8位PNG支持两种不同的透明形式（索引透明和alpha透明【附1】）。PNG-8颜色信息最多只能有256种颜色；PNG-24不支持透明PNG-24可以容纳1670万种颜色的颜色信息；PNG-32在PNG-24基础上增加了8位透明通道，因此可展现256级透明程度。
由于PNG是无损的，保存将要被编辑的图像来说更加合适。
JPEG（Joint Photographic Experts Group，联合图像专家小组）是一种针对照片影像而广泛使用的有损压缩标准方法。
JPEG是最常见的图像格式，是不支持透明的。图像占用的存储较小，但是牺牲了图像的质量。
作为一种有损的图像格式，用存储空间换了图像质量，各种压缩算法说白了就是抹掉图片里不打算存的数据。
由于JPEG是有损压缩，会产生迭代有损，在重复压缩和解码的过程中会不断丢失信息使图像质量下降。
JPEG的文件格式一般有两种文件扩展名：.jpg和.jpeg，这两种扩展名本质上是一样的，.jpg后缀的图片改为.jpeg对文件本身不会有任何影响。严格来讲，JPEG的文件扩展名应该为.jpeg，由于DOS时代的8.3文件名命名原则，就使用了.jpg的扩展名。
BMP（Bitmap）是一种没有压缩过的位图文件格式，色彩度很真实。但因该格式的图片保存了大量的数据，所以缺点是图片相对是比较大的。
因其未压缩的特性，区别于png、jpg格式采用不同压缩算法压缩体积会不同，后面会以BMP格式为例，计算图片的体积。
GIF | JPEG | PNG8 | PNG24 | PNG32 | |
|---|---|---|---|---|---|
创建年份 | 87年 | 92年 | 96年 | 96年 | 96年 |
是否有损压缩 | 无损 | 有损 | 无损 | 无损 | 无损 |
支持颜色数 | 256(8bit) | 1670W(24bit) | 256(8bit) | 1670W(24bit) | 1670W (32bit) |
体积 | 较小 | 压缩 | 较小 | 较大 | 大 |
是否支持透明 | 支持单一透明 | 否 | 支持索引透明和alpha透明 | 不支持透明 | 在24位的基础上增加了8位透明通道，可展现256级透明程度 |
PART2:图片大小的计算方式
图片体积的影响因素：
带着本文最初的问题，客户提供的图片中，为什么一样尺寸的两张图片，体积不一样？
Png格式图片是 1080宽，2130高，32位深度， 体积是2.02MB
jpg 格式图片是 1080宽，2340高，24位深度， 体积是149kb
要探究为什么体积不一样，就要搞清楚决定图片体积的主要因素。
1. 像素数量即图片长宽尺寸；如1080x2130
2. 图片格式，主要是格式对应的压缩算法；如JPEG
3. 位深和色深、通道数量
4. 图片压缩格式，如png，jpeg等
除此之外，还有些影响因素如：附加信息（如EXIF，【附2】）、图片内容复杂度 等
下面对这几个影响因素分别做简单阐述：
1. 尺寸：
像素数量这个就是字面意思，图片的高度乘以图片的宽度即可。
2. 位深
在某一分辨率下，每一个像素点可以有多少种色彩来描述，单位为“bit”(位)。
典型的色深有8-bit、16-bit、24-bit和32-bit几种。深度数值越高，可以获得更多的色彩。
24位色被称为“真彩色”，R、G、B各8bit，常说的 8bit，色彩总数为1670万；
3. 色深与通道
色深又叫色彩深度/色彩位数。
我们在计算机视觉领域，称RGB为颜色通道，彩色图像有三个通道值，每个颜色通道，都是一个 0～255 的整数值，占用一个字节（Byte）的存储空间。
画面中红、绿、蓝三个颜色通道中每种颜色为N位，总的色彩位数则为3N，色彩深度也就是视频设备所能辨析的色彩范围。
4. 图片压缩格式
压缩格式是影响图片体积的重要因素。
不同的压缩格式体积差别很大，如png格式通常要比jpeg大很多。
同样的尺寸的JPG图像大小通常也是不一样的，因为用DCT在压缩的时候，如果图像的色彩越丰富，那么压缩以后的尺寸越大，所以一张空白图和一张风景照压缩以后的文件大小是不一样的。
在不考虑第四点图片压缩格式的情况下，图片的体积计算方式基本是一致的。
如下图，一张 尺寸为4x4的图片，每一个网格代表一个像素，则未压缩的的原始图像数据，占用的存储空间为 4 x 4 x 3 = 48 字节 (Bytes) 。
照片大小= 整张照片的像素总数*每个像素点上的颜色编码大小 （无压缩位图，BMP等格式都属于这种格式）
在不压缩的情况下，图片占用空间的大小:
照片大小= 整张照片的像素总数*每个像素点上的颜色编码大小 （无压缩位图）
bmp位图的计算方式如下
大小=高度*宽度*位深/8/1024/1024 (MB)
如客户图1是未经压缩的位图: 1080*2130*32/8/1024/1024 = 8.77MB
如客户图2是未经压缩的位图: 1080*2340*24/8/1024/1024 = 7.32MB
常用的web图片格式——png/jpg/gif，无法得到准确公式，因为这几个格式都是有压缩的。
PART3:云端截图清晰度的影响因素
聊完图片体积，最后再结合本文阐述的图片体积影响因素，聊聊视频清晰度的一个影响因素。
视频是由一张张图片组成的，每张图片就是一帧（视频压缩又叫编码，本文不展开，后会开一篇专门聊聊视频清晰度），每张图片的体积又如上文所述有明确的影响因素，因而这些因素也同样会影响视频。
视频本身清晰度影响因素复杂，经过本地编码传输和云端的一些列处理，可以干预的因素就很少了。
码率是音视频中另一个重要的概念，这里引入一个参数值，Bits/(Pixel*Frame)， bits指的是比特率，pixel像素数，frame帧率。那么这个参数的意思就很明显了，平均每个像素所分配的数据空间大小。
一般来说，这个值越大，视频相对越清晰。所以简单理解，视频某帧的截图清晰度，很大程度上由当时的码率决定，一定情况下，提高视频的码率，对清晰度的提升会有一定的影响。（无限提高码率是不对的，一般分辨率和码率都是有对应的档次关系的，后续文章展开讲解）
那么，如果业务侧想要获取高质量的截图，最有效的方法是什么呢，是在推流端本地获取。云端截图功能的本质，更多的是配合监管或结合鉴黄等功能综合使用，对于有高清截图需求的场景，并不适合。
最后简单总结一下
1）BMP是无压缩的位图，简单的根据尺寸和位深度，就可以算出来尺寸
2）png是常见的无损压缩方式，图片质量通常要比jpeg好
3）jpeg跟jpg简单可以理解为一样的，是常见的有损压缩方式
4）jpeg有多重压缩算法，压缩后的压缩比，跟原图的“色彩丰富度”有关，没法定量计算压缩比
5）截图码率对截图清晰度很重要，但是业务侧想要获取“高清截图”，更有效的方式是在推流端上处理，从源头获取
附：
（1）补充alpha通道的概念：
“描述图片中的透明区域，此透明区域允许通透地显示背景，是指一张图片的透明和半透明度。例如：一个使用每个像素16比特存储的位图，对于图形中的每一个像素而言，可能以5个比特表示红色，5个比特表示绿色，5个比特表示蓝色，最后一个bit是alpha。在这种情况下，它要么表示透明要么不是，因为alpha bit只有0或1两种不同表示的可能性。又如一个使用32个bit存储的位图，每8个bit表示红绿蓝，和alpha通道。在这种情况下，就不光可以表示透明还是不透明，alpha通道还可以表示256级的半透明度，因为alpha通道有8个bit可以有256种不同的数据表示可能性。”
（2）Exif信息
Exif（Exchangeable image file format）是专门为数码相机的照片设定的，可以记录数码照片的属性信息和拍摄数据。
Exif 所记录的元数据信息非常丰富，主要包含了以下几类信息：
拍摄日期
拍摄器材（机身、镜头、闪光灯等）
拍摄参数（快门速度、光圈F值、ISO速度、焦距、测光模式等）
图像处理参数（锐化、对比度、饱和度、白平衡等）
图像描述及版权信息
GPS定位数据
缩略图
这里放一个在线查看照片exif信息的工具：
https://www.sojson.com/image/exif.html (含exif参数解释)
（3）如何用软件评判jpeg图片质量
可以使用magick工具，使用方式如下图所示，会给出评分等信息。安装使用简单，自行百度即可。
magick identify -verbose myimage.jpg
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。