iOS相关技术实现iOS

iOS端瘦身实践之图片资源篇

2018-07-09  本文已影响145人  roger_Hunter

        一样的目的,目前网上到处充斥着图片的瘦身,但是能完整记录下来并运用与实践的估计少之又少,本文档是在对我在项目中资源图片进行优化处理后的总结,采用了Webp技术,而目前该技术被国内外互联网公司使用,好像手淘的app和H5已经全面使用了Webp图片

1. 一般资源瘦身的步骤

图片来源于网络

2. 进行查找未使用的图片

LSUnusedResources

图1

    2.1 该工具是把在项目中没有用到的图片给找出来,但是该工具要求在项目中使用原图片名称,不能进行二次转换,不然查找失效,这也是我们项目中不能用该工具来批量查找未使用图片的原因了。

    2.2 Githud:https://github.com/tinymind/LSUnusedResources

3. 大比例压缩

    3.1 图片格式对比

图片来自于手淘

    3.2 PNG转Webp

图2

    注意:目前请使用2.1.2版本,3.1版本有问题

    png转换以及压缩工具iSparta:http://isparta.github.ios/

    Webp项目主页:https://developers.google.com/speed/webp/

    iOS Webp解析库:https://github.com/carsonmcdonald/Webp-iOS-example

3.3    坑:如果在使用该工具导出文件的过程中报如下错误,请重新导出文件为png,再进行格式转换

图3

4. 为何使用Webp,优点

    4.1 Webp压缩率高,支持有损与无损压缩

    4.2 Webp体积大幅减少,肉眼看不出差异

    4.3 Webp支持Alpha透明和24-bit颜色数,不像PNG8色彩不够出现毛边和毛刺

    4.4 Gif转Animated Webp有损可减少64%,无损19%

    4.5 小于256色适合无损压缩,压缩率高,参数使用- lossless –q 100

    4.6 大于256色使用75%有损压缩,参数使用-q75

    4.7 远大于256色使用75%以下压缩率,参数-q50 –m 6

5. Webp的缺点

    5.1 较PNG消耗2倍左右的CPU和解码时间

    5.2 全平台支持度不够,在iOS上可以通过对应的iOS的Webp解析库解决

6. 项目实践

    6.1 转换好图片后,使用开源的框架

    pod 'SDWebImage/WebP'

    在安装Webp的过程中要安装libwebp 0.6.0版本,而在下载该版本时,可能遇到超时问题:

图4

解决该问题的步骤为:

    6.1.1 查看cocoapods本地库路径:

            pod repo

    6.1.2 在本地库中,找到对应的libwebp版本的文件

图5

    6.1.3 进入libwebp目录,可以查看对应的版本

图6

    6.1.4 由于SDWebImage依赖的libwebp版本为0.6.0,所以进入该版本,并做修改

            sudo vim libwebp.podspec.json

            将其中的”git”对应的url替换为:https://github.com/webmproject/libwebp.git,并保存退出,后再次进行pod install即可

图片来源于网络

7. 在实际项目中的运用

    我们项目采用了统一的宏来加载图片,所以只要替换宏就达到目的

图7

8. 文件大小对比

图8

结束:以上就是我在实际项目中对图片资源进行初步优化的结果,当然还有很多要优化的方面,比如放入asserts里面,比如去重等等,暂且先这样吧...

上一篇 下一篇

猜你喜欢

热点阅读