字节跳动火山引擎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);

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

如何让Android 支持HEIF 图片解码和加载(免费的方法)的更多相关文章

  1. Android实现GIF图片解码与播放

    Android实现GIF图片解码与播放 如何在Android中播放GIF图片呢?如果直接按以前的方法,分解图片,可能相对比较麻烦. 今天给大伙介绍一种新的方式,构造自己的Android图片解码帮助类, ...

  2. 查看Android支持的硬解码信息

    通过/system/etc/media_codecs.xml可以确定当前设备支持哪些硬解码.通过/system/etc/media_profiles.xml可以知道设备支持的具体profile和lev ...

  3. (转)Android技术积累:图片异步加载

    当在ListView或GridView中要加载很多图片时,很容易出现滑动时的卡顿现象,以及出现OOM导致FC(Force Close). 会出现卡顿现象主要是因为加载数据慢,要等数据加载完才能显示出来 ...

  4. 利用CSS、JavaScript及Ajax实现图片预加载的三大方法

    预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...

  5. 利用CSS、JavaScript及Ajax实现图片预加载的三大方法(转)

    预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...

  6. 利用CSS、JavaScript及Ajax实现图片预加载的三大方法及优缺点分析

    预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...

  7. Android图片异步加载之Android-Universal-Image-Loader

    将近一个月没有更新博客了,由于这段时间以来准备毕业论文等各种事务缠身,一直没有时间和精力沉下来继续学习和整理一些东西.最近刚刚恢复到正轨,正好这两天看了下Android上关于图片异步加载的开源项目,就 ...

  8. [置顶] Android图片异步加载之Android-Universal-Image-Loader

    将近一个月没有更新博客了,由于这段时间以来准备毕业论文等各种事务缠身,一直没有时间和精力沉下来继续学习和整理一些东西.最近刚刚恢复到正轨,正好这两天看了下Android上关于图片异步加载的开源项目,就 ...

  9. 【sklearn】from sklearn.extermals import joblib(保存模型和加载模型)

    原创博文,转载请注明出处! sklearn中保存和加载模型的方法 1.载入模块 from sklearn.externals joblib. model = joblib. # -*- coding: ...

随机推荐

  1. 研发团队管理:IT研发中项目和产品原来区别那么大,项目级的项目是项目,产品级的项目是产品!!!

    前言   从事IT行业多年,一路从小杂兵成长为大团队Leader,对于研发整个体系比较清楚,其实大多人都经历过但是都忽略了的研发成本管控的一个关键的点就是研发过程中项目级和产品级的区别.   市场基本 ...

  2. Docker笔记(二) 安装常用软件

    常用环境安装 这里收集一些常用环境的安装步骤,可直接复制进行使用,节省安装时间,后续会随时补充 安装MySQL5.7.32 下载mysql5.7.32的镜像 ( 记得下载镜像要先确保镜像仓库中存在这个 ...

  3. JMeter日志查看

  4. Linux配置NTP时间服务器(date、hwclock、NTP服务器的配置)

    目录 date命令 hwclock命令 NTP服务的部署 服务端 客户端 date命令 date 命令的作用是查看和设置Linux中的系统日期时间 date                      ...

  5. MySQL UDF提权执行系统命令

    目录 UDF UDF提权步骤 UDF提权复现(php环境) UDF UDF (user defined function),即用户自定义函数.是通过添加新函数,对MySQL的功能进行扩充,其实就像使用 ...

  6. idea中注释变成繁体字

    原因:idea中快捷键与输入法快捷键冲突:crtl+shift+f 解决方法:修改输入法的简繁切换快捷键的设置,crtl+shift+f切换回简体输入方式 注意:如果调出全局搜索用crtl+shift ...

  7. Cmder右键配置

    Cmder右键配置 每次用camder手动一层一层的进入目标文件夹,是一件很麻烦的事儿.所以,将camder添加到系统右键菜单是个很好地解决方法. 1.把 Cmder 加到环境变量 把Cmder.ex ...

  8. 《Ray Tracing in One Weekend》阅读笔记 - 9、Metal(金属)

    如果我们希望不同的物体使用不同的材料,则需要进行设计决策.我们可以使用具有许多参数的通用材料,而将不同的材料类型仅将其中一些参数归零.这不是一个坏方法.或者我们可以有一个抽象的材料类来封装行为.我是后 ...

  9. Apache Hudi集成Spark SQL抢先体验

    Apache Hudi集成Spark SQL抢先体验 1. 摘要 社区小伙伴一直期待的Hudi整合Spark SQL的PR正在积极Review中并已经快接近尾声,Hudi集成Spark SQL预计会在 ...

  10. vue2.0与3.0响应式原理机制

    vue2.0响应式原理 - defineProperty 这个原理老生常谈了,就是拦截对象,给对象的属性增加set 和 get方法,因为核心是defineProperty所以还需要对数组的方法进行拦截 ...