前几天在微信公众号看到一篇关于App如何瘦身的文章,里面有提到过使用webP技术来压缩图片,于是乎就上网寻找关于webP技术的资料,并研究了如何在Android app中使用webP技术来让Android app瘦身。
webP是Google提出来的一种可以提供有损压缩与无损压缩的图片文件格式。主要的目的是为了减少数据量、加速网络传输的目的而开发出来的。关于更多的webP信息,可以自己Google。这里就不详细说了。
接下来我们开始说明如何在Android app当中使用该项技术:
1、打开浏览器并输入下面的网址
https://github.com/alexey-pelykh/webp-android-backport,该网址是webP项目库的GitHub地址。从该项目库 的介绍可以看出,该项目库主要针对的是Android 4.0版本以下的系统(其实Android4.0以上版本的系统已经能够自动支持webp技术,不用使用该项目库去解析webP的图片了)。
2、Win+R快捷键打开运行窗口,并输入cmd打开命令行窗口(我是在Windows系统下操作的)。使用git clone --recursive
https://github.com/alexey-pelykh/webp-android-backport.git ,然后按下回车键。(记住一定要加上--recursive选项,因为该项目库在webp-android-backport-library/jni的webp文件夹引用了其他仓库的子模块,所以要使用--recursive选项来将该子模块下载下来。)具体操作下图所示:
其中的https://github.com/alexey-pelykh/webp-android-backport.git 是该项目库的clone URL,可以在第一步的GitHub项目库中的右边找到HTTPS clone URL,然后点击复制面板,就可以复制到该clone URL。具体操作如下图所示(点击红色箭头指向的复制面板复制):
3、完成了前面的两步之后,我们已经获取了该webP项目库了,然后我们下载NDK并使用NDK将其编译成共享链接库文件(.so文件)。我使用的是NDK版本是android-ndk-r9-windows-x86(32位操作系统),大家可以根据自己的电脑的配置来选择相应的NDK版本。下载完毕后,将含有ndk-build.cmd的文件路径配置到系统的PATH环境变量中。
4、然后重启一下命令行窗口(关闭后再打开,如果没有的这样做,好像新配置的ndk的PATH环境变量识别不出来)。接着切换当前的目录到刚才下载下来的webP项目库目录,该目录下的文件如下图所示:
5、然后使用ndk-build命令开始编译共享链接库,编译完成的最后会看到该目录下多了libs和obj这两个文件夹(我们要使用的是libs这个文件夹,里面有生成的共享链接库),具体操作如下图所示:
6、然后我们将webp-android-backport-library作为依赖库添加到你的Android项目中,然后把libs文件夹下的全部文件当做webp-android-backport-library项目的依赖(我使用的IDE是Intellij Idea),最后我们就可以使用该web项目库来解析webP图片和编码普通图片到webP图片了。
7、最后使用webP项目下的example-project来实验一下结果的正确性:
我这里使用的是Google Nexus One模拟器(2.3.7系统),点击Load embeded按钮,可以看到webP图片被正确地解析出来了。后面两个功能没有实验,不过我实验了另外一个功能,即将一幅图(.jpg)放在drawable-hdpi文件夹下,然后使用nativeEncodeBitmap将该bitmap压缩,75代表的是图片质量为原来图片的75%(75是最佳压缩选择,此时的压缩率最高,而且肉眼也分辨不出压缩前后图片的质量问题;若是100,则压缩后的图片大小反而变大了,可以参考腾讯ISUX的webP探寻之路这篇文章:
isux.tencent.com/introduction-of-webp.html)
Bitmap bitmap = BitmapFactory.decodeResource(SampleActivity.this.getResources()
, R.drawable.first);
byte[] webpImageData = WebPFactory.nativeEncodeBitmap(bitmap, 75);
try
{
FileOutputStream dumpStream =
new
FileOutput
Stream(
new
File(Environment.
getExternalStorageDirectory
()
,
"dump.webp"
))
;
dumpStream.write(webpImageData)
;
dumpStream.close()
;
}
catch
(FileNotFoundException e) {
e.printStackTrace()
;
}
catch
(IOException e) {
e.printStackTrace();
}
实验说明了webP这项技术还是挺好用的,特别是对于现在的App来说,基本上图片占了大部分,webP技术提供了图片的压缩,但是却并不影响观看的质量,这不仅仅可以使得图片的传输速率提高了,也还大大地提高了用户体验。
关于webP的一些参考资料:
http://en.wikipedia.org/wiki/WebP
https://developers.google.com/speed/webp/
http://tech.qq.com/a/20140721/074637.htm
http://faso.me/slides/2014/webp/
http://www.webpagetest.org/video/compare.php?tests=141121_3W_JT7,141121_6Q_JSM