字节跳动火山引擎ImageX提供了一种能力,可以支持客户端android 直接解码HEIF 和HEIC图片,经过测试发现,可以免费使用;

一、阅前准备

  • HEIF图片格式是什么?

高效率图像格式(High Efficiency Image Format ,HEIF)最早被苹果公司的 iPhone 所使用,并且也将用于 Google 的 Android P 手机系统。微软也于最新放出的 Windows 10 Build 17123 预览版开始,新增了对 HEIF 图像格式的系统原生支持,所以系统极客将在本文中为大家简介 HEIF 这一新兴的高效率图像格式。

  • HEIF优于JPEG图像格式

高效率图像格式在各方面均优于 JPEG,通过使用更现代的压缩算法,它可以将相同数量的数据大小压缩到 JPEG 图像文件的 50% 左右。随着手机 Camera 的不断升级,照片的细节也日益增加。通过将照片存储为 HEIF 格式而不非 JPEG,可以让文件大小减半,几乎可以在同一部手机上存储以前 2 倍的照片数量。如果一些云服务也支持 HEIF 文件,则上传到在线服务的速度也会更快,并且使用更少的存储空间。在 iPhone 上,这意味着您的照片应该会以以前两倍的速度上传到 iCloud 照片库。

JPEG 标准可以追溯到 1992 年,JPEG 标准的最新版本也于 1994 年完成,JPEG 长期以来为我们提供了很好的服务,但现代(新)标准超越它并不是很奇怪。

  • HEIC唯一缺点:兼容性

目前使用 HEIF 或 HEIC 照片唯一的缺点就是兼容性问题。现在的软件只要能够查看图片,那它肯定就可以读取 JPEG 图像,但如果你拍摄了以 HEIF 或 HEIC 扩展名结尾的图片,并不是在所有地方和软件中都可以正确识别。

这也是当我们将照片附加到电子邮件或在不支持 HEIF 文件的服务中进行共享时, iPhone 和 iPad 会自动将其转换为 JPEG 图像的原因。在使用 iTunes 将 HEIF 照片导入 Windows PC 时,也会自动将它们转换为 JPEG 格式。

虽然 Mac 从 macOS High Sierra 开始支持 .HEIF 和 .HEIC 文件,但 Windows 10 从 Windows 10 Build 17123 预览版才开始提供 HEIF 图像内置支持,所以对于老旧 Windows、macOS 和旧版 iOS 与 Android 用户需要使用第三方图像查看器或转换软件才能查看 .HEIF 或 .HEIC 文件。

那我们如何让HEIF 支持全端Android 机型呢? 这里提供了一种软解码实现方案,具体接入如下:

二、遇到了什么问题

  • HEIF 图片在iOS 11以上开始支持,但是在Android 系统支持 一直比较慢,而且有很多系统性的bug 会导致解码失败;所以我们干脆实现一种软解的方案;

  • HEIF 使用自研的解码能力,发现使用HEIF 图片加载整体体积降低 50%+,用户加载更快!

  • 针对线上图片性能、图片进行可用性、网络耗时的监控,全面感知客户端的图片加载问题;

三、开发环境

推荐开发者使用 Android Studio 作为自己的开发工具,本开发文档也是基于 Android Studio开发环境下进行编写的。

四、集成方式

详细阅读:https://www.volcengine.com/docs/508/65969

  1. 项目 build.gradle 下加上
maven {
url 'https://dl.bintray.com/ttgamesdk/public'
}
  1. app module build.gradle下加上
implementation 'com.bytedance.fresco:fresco:1.0.4'
implementation "com.bytedance.fresco:animated-gif:1.0.4", //gif
implementation "com.bytedance.fresco:animated-webp:1.0.4", //webp animated
implementation "com.bytedance.fresco:webpsupport:1.0.4", //低版本webp支持
implementation "com.bytedance.fresco:drawee:1.0.4", //fresco组件
implementation "com.bytedance.fresco:statistics:1.0.4", //监控+网络组件
implementation "com.bytedance.fresco:heif:1.0.4"

五、接入说明

1. 初始化

SDK在集成之前需要将此AppID传入参数里(需要注意的是AppID在Android端SDK中也简写为“aid”),部分参数含义详解如下:

  • AppID(aid):SDK用于打点监控上报的最小单元,通过此将数据进行隔离上报,同时通过AppID可以拉取对应的云控配置比如客户端采样率、网络优化参数等。

  • deviceId:设备的唯一编号,用于统计区分使用。

  • versionName,versionCode:主要用于数据统计与配置拉取。

  • channel:渠道标识,用于区分统计,比如根据不同频道可以传入huawei、oppo等不同渠道便于自动以统计。

  • appName:App的名称,用于统计使用。

  • isOversea:主要根据App是否发布海外决定上报的日志的物理位置,满足GDPR合规性要求,如实填写,比如App为南美使用,则传入 true即可,采样后的日志自动上报到海外地区。

String aid =  "xxx";                // App ID
String deviceId = "xxx" ; // 设备 ID
String versionName = "0.0.1" ; // App 版本号
String versionCode = "1" ; // App 版本code
String channel = "debug" ; // 渠道
String appName = "Sample" ; // App 名称
boolean isOversea = false; // App是否发布在海外
_// 统计功能_
Set<RequestListener> listeners = new HashSet<>();
listeners.add( new FrescoTraceListener( this , aid, deviceId, versionName, channel, isOversea)); _// HEIF功能配置_
PoolFactory factory = new PoolFactory(PoolConfig. _newBuilder_ ().build());
ImagePipelineConfig.Builder builder = ImagePipelineConfig. _newBuilder_ ( this )
.setNetworkFetcher( new FrescoTTNetFetcher( this , aid, deviceId,versionCode, versionName,
channel, appName))
.setRequestListeners(listeners)
.setImageDecoderConfig(ImageDecoderConfig. _newBuilder_ ().addDecodingCapability(
HeifDecoder. _HEIF_FORMAT_ ,
new HeifDecoder.HeifFormatChecker(), new HeifDecoder.HeifFormatDecoder(factory.getPooledByteBufferFactory())).build()); Fresco. _initialize_ ( this , builder.build());

注 :FrescoTraceListener构造参数均不能为null

FrescoTraceListener(@NonNull Context context,
@NonNull String aid,
@NonNull String deviceId,
@NonNull String appVersion,
@NonNull String channel,
boolean isOversea)

注 :FrescoTTNetFetcher构造参数均不能为null

public  FrescoTTNetFetcher(@NonNull Application context,
@NonNull String appId,
@NonNull String deviceId,
@NonNull String versionCode,
@NonNull String versionName,
@NonNull String channel,
@NonNull String appName)

2. 使用方式

使用方式和正常的Fresco一样,Fresco的 api 并没有修改,参考:https://www.fresco-cn.org/

3. 单独使用监控功能的方式

如果不想使用改造后的Fresco,使用facebook源的Fresco,可以只使用提供的统计功能。

implementation "com.bytedance.fresco:statistics:1.0.4"
Set<RequestListener> listeners =   new    HashSet<>();
listeners.add( new FrescoTraceListener(context, "xxx" , "xxxx" , "0.0.1" , "debug" , false ));
ImagePipelineConfig.Builder builder = ImagePipelineConfig. _newBuilder_ ( this )
.setNetworkFetcher( new TTFrescoOkHttpFetcher())
.setRequestListeners(listeners)
Fresco. _initialize_ ( this , builder.build());

4. Feature使用

Android 9.0 libwebp解码

Android 9.0版本上,系统原生的Webp解码方式有bug,这里提供使用libwebp解码的方式。

ImagePipelineConfig  . Builder  builder =   ImagePipelineConfig  .newBuilder(  this  );
// 对9.0版本打开libwebp解码
builder.experiment().setPieDecoderEnabled( true );

性能差异:在honor magic2上对同一图片进行benchmark测试,Android原生解码:15.9ms,libwebp解码:16.4ms,差距不大。

低内存策略

接入方式:

Fresco初始化之前配置以下代码

    ImageDecodeBitmapConfigStrategy.setStrategy(ImageDecodeBitmapConfigStrategy. _MEMORY_AT_LEAST_ );

OOM兜底

接入方式:

ImagePipelineConfig  . Builder  builder =   ImagePipelineConfig  .newBuilder(  this  )
builder.experiment().setOomOptEnabled( true );

动图渐进式

接入方式:

  1. 全局开启:
ImagePipelineConfig  .getDefaultImageRequestConfig().setProgressiveRenderingEnabled(  true  );
  1. 单个请求开启:
ImageRequestBuilder  builder =   ImageRequestBuilder
.newBuilderWithSource(uri)
.setProgressiveRenderingEnabled( true );
DraweeController controller = Fresco .newDraweeControllerBuilder()
.setAutoPlayAnimations( true )
.setImageRequest(builder.build())
.setOldController(getController())
.build();
setController(controller);

智能裁剪

接入方式:

ImageRequestBuilder builder = ImageRequestBuilder
. _newBuilderWithSource_ (uri)
.setImageDecodeOptions( new ImageDecodeOptionsBuilder()
.setUseSmartCrop( true )
.build());
DraweeController controller = Fresco. _newDraweeControllerBuilder_ ()
.setImageRequest(builder.build())
.setOldController(getController())
.build();
setController(controller);

文章为原创文章,若有侵权请联系;

最新文章

  1. VI的一些快捷键
  2. tomcat 容器生命周期lifecycle
  3. FireBug调试工具笔记
  4. 【leetcode】Rotate Image(middle)
  5. Linux(Ubuntu)之设定开机自启动
  6. Bower安装Bootstrap
  7. archlinux更新错误
  8. 学习WPF——WPF布局——初识布局容器
  9. C#类的继承相关总结
  10. DOS 循环读取txt每一行内容
  11. log4j与commons-logging,slf4j的关系
  12. Dorado7检验器失效原因分析
  13. leetcode 6
  14. Ogre1.8.1编译时大量warning的问题
  15. 不同的extend 在调用构造函数时不同的写法
  16. 转:web前端面试题合集 (Javascript相关)(js异步加载详解)
  17. Oracle的用户,权限以及角色
  18. .net core 命令行(仅作记录)
  19. Windows 10 远程连接出现函数错误 【这可能由于CredSSP加密Oracle修正】
  20. redis加固

热门文章

  1. Day01_07_Java关键字和字面值
  2. kubernetes的架构
  3. Jquery 代码参考
  4. Sublime Text 3 Build 3176 License
  5. POJ3114强连通+spfa
  6. JQuery跨站脚本漏洞
  7. Python中hashlib模块的使用
  8. Ubuntu Linux 学习篇 配置DHCP服务器
  9. XCTF-ics-04
  10. Day003 位运算