移动互联网实战--移动端音频和图形优化处理
mumuxinfei
移动互联网实战--移动端音频和图形优化处理
前言:
移动端应用, 需要省电省流量(带宽), 大资源包对用户体验是有伤害的. 因此移动端开发需要精简资源(音频/图片), 但又要保证音频/图片质量. 本文着重讲述如何优化处理资源(音频/图片), 如何在高压缩比和高质量(音质/画质)之间进行折中和权衡. 本文涉及两大块, 一块为语音处理, 另一块为图像处理.
注: 本文主要面向移动端开发者, 利用编程去优化处理. 掺杂了小编(mumuxinfei)的不成熟观点和看法, 希望能抛砖引玉.
*) 样例阐释:
1. 构造应用场景
把常规Wav格式的音频文件, 转化为更小的Mp3格式音频文件.
样例代码借助JAVE(Java Audio Video Encoder)来实现. 请点击: JAVE官网.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
File source = new File("data/source.wav");
File target = new File("data/target.mp3");
// *) 设置音频属性
AudioAttributes audio = new AudioAttributes();
audio.setCodec("libmp3lame");
audio.setBitRate(new Integer(128000));
audio.setChannels(new Integer(2));
audio.setSamplingRate(new Integer(44100));
// *) 解码器设置
EncodingAttributes attrs = new EncodingAttributes();
attrs.setFormat("mp3");
attrs.setAudioAttributes(audio);
Encoder encoder = new Encoder();
encoder.encode(source, target, attrs);
|
2. 效果展示
Wav格式转化为Mp3格式后, 实际大小对比如下所示:
Wav格式文件: 100044byte, Mp3格式文件: 18839byte
经过小编的亲身体验(试听), 立场坚定的表示音质无明显差别, 但文件压缩比却有明显的提升.
3. 疑惑和不解
虽然大获成功, 但是小编还是有些不解, 疑问一坨坨. -_-!!!
#) 音频文件中的比特率(bitrate), 声道(channel), 采样率(samplingrate)具体是什么?
#) 在文件压缩和音质中, 那个要素扮演更重要的角色? 是他, 是她, 还是它? 唉, 我的妈呀, 小编我傻傻分不清了.
小编手溅, 于是修改下代码, 取取不同的比特率/采样率值, 看看是否有惊喜会出现?
|
1
2
3
4
5
6
7
8
|
// *) 设置音频属性
AudioAttributes audio = new AudioAttributes();
audio.setCodec("libmp3lame");
//audio.setBitRate(new Integer(128000));
audio.setBitRate(new Integer(250000));
audio.setChannels(new Integer(2));
//audio.setSamplingRate(new Integer(44100));
audio.setSamplingRate(new Integer(40000));
|
我乐个大擦, "惊喜"出现了, -_-!!!!!!! 居然罢工, 还抛异常, 抛,抛,抛,抛你妹啊.....
|
1
|
Exception in thread "main" it.sauronsoftware.jave.EncoderException: Error while opening codec for output stream #0.0 - maybe incorrect parameters such as bit_rate, rate, width or height
|
小编不由得困惑了, 莫非比特率和采样率有某种神秘的关系? 你看, 他两结尾都带个了'率'字, 而且读起来又都那么朗朗上口? 搞基不(MD, 不小心说出了心里话)? 算了, 其实小编内心还是小小期待下, oh yeah.
And 疑惑继续....
#) 比特率和采样率的取值是否有一定的限制?
#) 比特率和采样率究竟存在怎么样关系呢?
*) 基础知识
真是好奇心害死猫, 小编带着这些疑团去知(姿)识(势)渊(丰)博(富)的百度君.
小编: 百度君,你好,你能给我们介绍下音频文件中的比特率(bitrate), 声道(channel), 采样率(samplingrate)具体是什么?
百度君: #%~!@#$%^&*()~&(@!*^!@&*^*&%(*%&^%^$~!*)()*)@&(*^@#(*^(!&(!^(
小编(怒): 讲人话......
百度君:
音频文件有三个重要的属性描述: 采样率(samplingrate)/比特率(bitrate)/声道(channel)
#)比特率：音频数据每秒中需要多少个比特来表示,比特率越高音频质量越好, 文件也越大.
#)采样率：采样率定义了每秒从连续信号中提取并组成离散信号的采样个数，用赫兹（Hz）来表示.
#)声道：声道分单声道, 双声道两种, 单声道是混合均匀从左右声道出来, 而双声道则是从不同声音
从左右声道出来并合成, 现场立体感强.
小编(内心)：哼，百度君果然吃软怕硬，不过好像说的好专业，不明觉厉．
小编：那请问比特率和采样率的取值有限定吗？
百度君：
#) 比特率取值
比特率取值: 32kbps/96kbps/128kbps/192kbps/224kbps/320kbps
#) 采样率的取值
44.1kHz系列采样: 11.025kHz, 22.05kHz, 44.1kHz, 88.2kHz, 176.4kHz
48kHz系列采样: 12kHz, 24kHz, 48kHz, 96kHz, 192kHz
小编(内心)：这下长见识了，以后叫你还抛，抛，抛不了你妹了，娃哈哈, 喂, 说你呢? 看什么看, 还看!!!!
小编：那请问，这个44.1kHz有特殊来由吗?
百度君:人类的听觉波段在20Hz到20kHz, 由Nyquist采样定理, 采样评率只要超过信号带宽2倍就不会产生混迭. 而实际上音乐CD规范则采用44.1kHz(20kHz两倍多)做为采样标准. 因此44.1kHz和人类的可听波段有一定的关联.
激动人心的时候, 终于要来了, 此时空气仿佛凝固了....
小编(喜): 那比特率君和采样率君究竟有何奸情呢? (啊呸, 竟然不小心说漏嘴了......)
百度君: 两个维度,互不影响. 简而言之, 比特率用于音频编码过程中, 而采样率用于语音播放中. 比特率与音质成正比, 文件大小成反比. 而采样率只与音质成正比.
天空一行乌鸦飞过, 哇哇哇.....
小编(内心): 这TM是玩我吗? 搞得这么亲热, 还一直形影不离, 最后竟然告诉我,他俩没半毛钱的关系, 这谁信啊!!!!!!
小编(失落): 真是个意外的结果, 万万没想到, 这个世上还是有纯粹的友谊存在, 不管你信不信, 反正我是信了.
唉, 突然觉得菊花好痒......
*) 进阶篇
1). 查阅音频文集元信息
如何借助JAVE来实现, 代码片段如下:
|
1
2
|
MultimediaInfo info = encoder.getInfo(target);
System.out.println(info);
|
Console 结果输出如下:
|
1
|
(decoder=pcm_s16le, samplingRate=22050, channels=2, bitRate=705)
|
评注: 解码器为: pcm_s16le, 采样率: 22.05kHz, 双声道, 比特率705Kbps
2). 尝试把Wav转化为各个比特率的Mp3格式
| 采样率/比特率 | 24kbps | 48kbps | 96kbps | 192kbps |
| 11.025kHz | 3792 | 7554 | 15077 | -- |
| 22.05kHz | 3636 | 7241 | 14451 | -- |
| 44.1kHz | -- | 7084 | 14137 | 28243 |
评注: 比对横向/竖向, 可以看到文件大小与比特率相关, 而采样率和比特率之间有一定的组合限定.
3). 尝试把Wa转化为各个解码器的音频格式
音频的解码器, 取决于音频格式, 简单罗列下:
|
1
2
3
4
|
mp3 => libmp3lame
ogg => vorbis
wav => pcm_s16be/pcm_s16le/pcm_s24le
3gp => libfaac
|
更多的解码器, 请点击: 官网
在相同条件(比特率:24kbps, 采样率:22.05kHz, 双声道)
| 音频格式 | mp3 | ogg | wav | 3gp |
| 文件大小 | 3636 | 6586 | 100044 | 2668 |
当在相同条件(比特率:48kbps, 采样率:44.1kHz, 双声道)
| 音频格式 | mp3 | ogg | wav | 3gp |
| 文件大小 | 7084 | 8722 | 199980 | 5177 |
评注: 可以看出, 同等条件下文件大小: 3gp < mp3 < ogg << wav, 但文件压缩比高不代表好, 最终需要在压缩比/音质取个折中
图像处理
移动端对图片格式的选择: 主流为PNG/JPEG格式. PNG它兼具JPG图片的质量和GIF格式的透明, 文件大小较JPEG大. JPEG格式画质好, 色彩和饱和度高, 文件相对相对较小. 因此一般有如下实践原则: 小尺寸, 色彩数小或使用到透明的时候用PNG, 大尺寸, 色彩渐变色多的时候用JPG.
移动端的图片优化包括两方面, 一块为图片格式转换, 一块为图片像素大小调整.
代码片段:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
public void convertImage(String sourceFile, String destFile, int newWidth, int newHeight) {
// *) 假定传入destFile, 都是 *.jpg, *.png 的命名方式, 这边不做检查处理
String format = destFile.substring(destFile.lastIndexOf('.') + 1);
try {
Image srcImage = ImageIO.read(new File(sourceFile));
// *) 绘制源图像到目标图像
BufferedImage destImage = new BufferedImage(newWidth, newHeight, BufferedImage.TYPE_3BYTE_BGR);
Graphics2D g2 = (Graphics2D) destImage.getGraphics();
g2.drawImage(srcImage, 0, 0, newWidth, newHeight, null);
// *) 生成目标图像
ImageIO.write(destImage, format, new File(destFile));
} catch (IOException e) {
e.printStackTrace();
}
}
|
评注: 这段代码能实现jpg=>png, jpg=>gif, jpg=>bmp, png=>jpg的转换, 同时实现不同分辨率的图像转换
实验比较, 原图如下(秀福利)
文件大小比对如下:
| 图片格式 | JPG | PNG | GIF | BMP |
| 文件大小 | 19.0KB | 267.9KB | 48.7KB | 386.8KB |
对比可以发现, 等同像素下, 图片文件大小为 jpg < gif < png < bmp
继续实验, 把大分辨率图像转化为小分辨率(主流分辨率)图像, 压缩率有多少
| 分辨率 | 1600*1200 | 1280*1024 | 1080*960 | 960*540 | 854*480 |
| 文件大小 | 251.7KB | 188.8KB | 157.7KB | 90.3KB | 74.7KB |
如果想更深入的对图像质量进行控制, (比如jpg图像质量, 默认缺省质量为0.75):
代码片段如下:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
|
public void convert2JPGImage(String sourceFile, String destFile, int newWidth, int newHeight, float quality) {
FileOutputStream out = null;
try {
Image srcImage = ImageIO.read(new File(sourceFile));
// *) 绘制源图像到目标图像
BufferedImage destImage = new BufferedImage(newWidth, newHeight, BufferedImage.TYPE_3BYTE_BGR);
Graphics2D g2 = (Graphics2D) destImage.getGraphics();
g2.drawImage(srcImage, 0, 0, newWidth, newHeight, null);
// *) 生成目标图像, 借助com.sun.image.codec.jpeg.JPEGImageEncoder来实现
out = new FileOutputStream(destFile);
JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder(out);
JPEGEncodeParam jep = JPEGCodec.getDefaultJPEGEncodeParam(destImage);
jep.setQuality(quality, true);
encoder.encode(destImage, jep);
} catch (IOException e) {
} finally {
if ( out != null ) {
try {
out.close();
} catch (IOException e) {
}
}
}
}
|
总结:
移动端开发需要一定的音频/图片优化技巧, 对资源类的app而言, 这一点就特别的重要. 文件压缩比不是越高越好, 对高音质/高画质的追求会付出一定的代价.总而言之: 没有完美的解决方案, 只有永恒的折中.
关注 - 136
粉丝 - 184
» 下一篇：Kafka实战系列--Kafka的安装/配置
posted on 2014-07-21 16:42 mumuxinfei 阅读(1152) 评论(2) 编辑 收藏
评论
#1楼 2014-10-25 01:09土豆哥哥
#2楼 2015-03-02 16:33探路者0101
【活动】2050 大会 - 年青人因科技而团聚（5.26-5.27 杭州·云栖小镇）
【推荐】华为云 7大明星产品0元免费使用
【活动】腾讯云云服务器新购特惠，5折上云
【大赛】2018首届“顶天立地”AI开发者大赛
· Edge浏览器引入同站点Cookies支持 防御跨站请求伪造攻击
· 特斯拉CEO马斯克晒“无聊”牌糖果 真要开糖果公司？
· Google收购Cask Data，进一步强化大数据分析能力
· 人工智能淘金潮中，究竟谁在赚钱？（第一部分）
· “新韭菜”不够咋办？山寨币瞄向学生党和老人家
» 更多新闻...
· 如何高效学习
· 如何成为优秀的程序员？
· 菜鸟工程师的超神之路 -- 从校园到职场
· 如何识别人的技术能力和水平？
» 更多知识库文章...
公告
园龄：6年11个月
粉丝：184
关注：136
导航
- 博客园
- 首页
- 新随笔
- 联系
- 订阅
- 管理
|
|||||||||
| 日 | 一 | 二 | 三 | 四 | 五 | 六 | |||
|---|---|---|---|---|---|---|---|---|---|
| 29 | 30 | 1 | 2 | 3 | 4 | 5 | |||
| 6 | 7 | 8 | 9 | 10 | 11 | 12 | |||
| 13 | 14 | 15 | 16 | 17 | 18 | 19 | |||
| 20 | 21 | 22 | 23 | 24 | 25 | 26 | |||
| 27 | 28 | 29 | 30 | 31 | 1 | 2 | |||
| 3 | 4 | 5 | 6 | 7 | 8 | 9 | |||
统计
- 随笔 - 139
- 文章 - 0
- 评论 - 148
- 引用 - 0
搜索
常用链接
- 我的随笔
- 我的评论
- 我的参与
- 最新评论
- 我的标签
我的标签
- 游戏(16)
- AI(13)
- html5(12)
- thrift(10)
- mysql(9)
- springmvc(8)
- nginx(8)
- linux(7)
- Java(6)
- hive(6)
- 更多
随笔分类
- ACM--数据结构和算法(5)
- HTML5(1)
- java 性能调优实战(4)
- Java基础组件(19)
- Linux 开发和工具(14)
- python 实战(3)
- shell 脚本实战(11)
- Thrift 个人实战(6)
- 大数据Hadoop生态圈(17)
- 代码抄袭检测系统的设计和实现(1)
- 德州扑克(3)
- 那一夜, 我们不谈技术, 只谈风月(4)
- 让我们谈谈红包(3)
- 我的游戏人生(14)
- 移动互联网工程应用(2)
- 移动互联网应用实战(10)
随笔档案
- 2018年5月 (2)
- 2018年4月 (5)
- 2018年3月 (1)
- 2018年2月 (2)
- 2018年1月 (1)
- 2016年10月 (1)
- 2016年6月 (1)
- 2016年5月 (3)
- 2016年4月 (4)
- 2016年3月 (3)
- 2016年2月 (5)
- 2016年1月 (2)
- 2015年12月 (4)
- 2015年11月 (3)
- 2015年10月 (3)
- 2015年9月 (2)
- 2015年8月 (5)
- 2015年7月 (6)
- 2015年6月 (4)
- 2015年5月 (8)
- 2015年4月 (8)
- 2015年3月 (7)
- 2015年2月 (1)
- 2014年10月 (1)
- 2014年9月 (8)
- 2014年8月 (12)
- 2014年7月 (21)
- 2014年6月 (6)
- 2014年5月 (3)
- 2014年4月 (6)
- 2014年3月 (1)
积分与排名
- 积分 - 147788
- 排名 - 1922
最新评论
- 1. Re:网页闯关游戏(riddle webgame)--仿微信聊天的前端页面设计和难点
- 楼主分享的的确不错，下面这篇博文是使用h5开发的仿微信聊天案例
- --xiaoyan2017
- 2. Re:Java Mysql连接池配置和案例分析--超时异常和处理
- 看了好多文章，这篇文章对连接池主动淘汰三种情况的分析逻辑清晰，这是我看过DBCP参数设置最明白的一个，谢谢！
- --llandyl
- 3. Re:springmvc学习笔记--ueditor和springmvc的集成
- @蛹乐我有点忘记了, 百度ueditor的官网里有, 我是直接把ueditor的源码放到工程里了, 因为我需要里面的一些源码, 具体你在研究一下吧...
- --mumuxinfei
- 4. Re:springmvc学习笔记--ueditor和springmvc的集成
- ueditor-x.x.x.jar关于这个包maven的引入，想看看你详细的博客详解，希望博主早点发东西
- --蛹乐
- 5. Re:基于redis的排行榜设计和实现
- redis的有序集合是可以实现这种排序；1）但是如果要存储用户的信息如：mobile等这样行不行？2）zRevRangeByScore和zRevRank获得的数据，如果score相同，都是按照最新的插......
- --Mchgloak
阅读排行榜
- 1. springmvc学习笔记--ueditor和springmvc的集成(12925)
- 2. springmvc学习笔记---idea创建springmvc项目(10793)
- 3. 基于redis的排行榜设计和实现(10325)
- 4. Hive 实战(2)--hive分区分桶实战(8164)
- 5. 对弈类游戏的人工智能(1)--评估函数+博弈树算法(7381)
评论排行榜
- 1. 浅谈群红包的实现(14)
- 2. 对弈类游戏的人工智能(4)--游戏AI的落地(12)
- 3. Thrift 个人实战--初次体验Thrift(9)
- 4. 台球游戏的核心算法和AI(2)(9)
- 5. 台球游戏的核心算法和AI(1)(8)
推荐排行榜
- 1. 浅谈群红包的实现(15)
- 2. Thrift 个人实战--Thrift 网络服务模型(7)
- 3. 谈谈面试--哈希表系列(7)
- 4. 移动互联网实战--Web Restful API设计和基础架构(6)
- 5. Thrift 个人实战--Thrift RPC服务框架日志的优化(5)
移动互联网实战--移动端音频和图形优化处理相关推荐
- 嵌入式端音频开发（实战篇）之 4.2 把很多音频合成一个bin文件并统计每个音频文件的大小的方法（内含转换脚本）
查看本系列全部文章请点击:嵌入式端音频开发系列汇总(持续更新) 查看本文全部内容:嵌入式端音频开发(实战篇)之 4.2 把很多音频合成一个bin文件并统计每个音频文件的大小的方法(内含转换脚本) 文件 ...
- 《WebRTC系列》实战 Web 端支持 h265 硬解
1.背景 Web 端实时预览 H.265 需求一直存在,但由于之前 Chrome 本身不支持 H.265 硬解,软解性能消耗大,仅能支持一路播放,该需求被搁置. 去年 9 月份,Chrome 发布 M ...
- 解决移动端音频自动播放问题
解决移动端音频自动播放问题 参考文章: (1)解决移动端音频自动播放问题 (2)https://www.cnblogs.com/lcf1314/p/5867010.html 备忘一下.
- IntelliJ IDEA 如何用 真机 测试安卓（Android）App 实战移动端
目录 前言 真机测试步骤 实战移动端测试 前言 https://blog.csdn.net/hanhanwanghaha一个超级无敌可爱的人鸭 欢迎您的关注! 欢迎关注微信公众号:宝藏女孩的成长日记 ...
- 互联网中B端客户和C端客户的区别？
互联网中B端客户和C端客户的区别? 1.用户群体 2.业务形态 3.用户诉求(价值主张) 4.对于PM的要求 5.用户推广获取过程 CAC 6.产品层面 7.壁垒 8.后期运维层面(客户关系维护) 9 ...
- 响铃：互联网金融理财端寡头时代来临，到底谁该被剩下来？
近日,互联网金融又遇大事,百度与中信银行成立直销银行:百信银行,这意味着BAT三大巨头均以不同形式拿到银行牌照.至此互联网金融"井喷式"发展过后,进入了新的排位赛,行业加速优胜劣汰 ...
- 嵌入式端音频开发（基础篇）之 1.5 opus应用指南
查看本系列全部文章请点击:嵌入式端音频开发系列汇总(持续更新) ==================================================================== ...
- idea android 真机,IntelliJ IDEA 如何用 真机 测试安卓（Android）App 实战移动端
前言 用IntelliJ IDEA自带的模拟器遇到问题始终没有解决,这个报错死磕几天了,谷歌+百度的各种方法都试了一遍(总感觉是哪里的细节没有解决对).本来想再坚持半天(但是要解决燃眉之急了)不得不放 ...
- 项目实战-PC端固定布局【2】认识网页大纲算法（HTML5 Outliner）
注: body,nav,section需要标题 head,div不需要标题 链接: https://gsnedders.html5.org/outliner/ 步骤:选择文件--->Outlin ...
最新文章
- 算法 msrcr_一种快速简便优秀的全局曲线调整与局部信息想结合的非线性彩色增强算法（多图深度分析和探索）...
- 《深入理解计算机系统》第七章读书笔记
- [Eclipse]GEF入门系列（九、增加易用性）
- 高效地加载图片(一) 高效地加载大图
- _欧冠F组第1轮，拉齐奥3-1大胜多特蒙德
- 《Windows核心编程》学习笔记（9）– 在win7或者vista系统下提升一个进程的运行权限...
- JAVA面试题------------final 关键字是干什么用的？谈谈你的理解。
- shiro的集群动态权限更新
- 如何理解if __name__=='__main__'?
- c# 指定打开某个路径下的CMD_【自学C#】|| 笔记 25 文件的操作
- 如何消灭 Android 应用中的广告？
- Java反射机制获取系统@Hide属性
- 【推荐算法】协同过滤算法——基于用户 Java实现
- Inception-v4结构代码
- 如何获取常用汉字(GB2312)
- 免费在线二维DataMatrix码生成器
- 【题解】【AcWing】149. 荷马史诗
- [ROS Navigation Tuning Guide]翻译
- 哈佛结构和冯诺依曼结构特点
- Redis底层 知识（校招、社招必看）