直播动画框架探索

帧动画OpenGL

实现简单

播放图片资源占用高；

属性动画

资源占用小

1. 播放图片资源占用高； 2. 实现难度大，实现效率低；

GIF

实现简单

1. 播放图片资源占用高； 2. 资源文件包比较大； 3. 效果不是很好(只支持8位颜色)

webp

1. 实现简单； 2. 相对GIF，资源文件包变小；

1. 播放图片资源占用高

动画库

1. 一套引擎，三端公用； 2. 一套协议，三端各自实现

支持平台

Android/iOS/Web

Android/iOS/Web

设计工具支持

After Effects

AE & Flash

导出工具

插件

插件

资源包大小zip

2.6M

767k

优点

三端可用自行缓存不需要二次开发

资源包小测试工具齐全三端可用Protobuf 序列化结构数据格式，传递效率比xml,json 更高

缺点

资源包相较SVGA而言会大一倍多

每个礼物播放时都去重新解压，需要自行实现一套缓存策略svga 用zlib打包，不方便解压和追踪包内容。

实现方式

一层一层完全按照设计工具的设计思路来进行还原，将动画脚本导出并解析。动画脚本非常的轻量。将所有的动画拆成多个层级,每个层级layer都有一个动画配置，播放时解析多个layer的配置，并给每个layer做相应的动画。也达到了图片可以复用。当需要解析高阶插值（二次线性方程，贝塞尔曲线方程）时，性能相对而言差一点。

一帧一帧通过设置帧率，来生成一个配置文件，使得每一帧都有一个配置，每一帧都是关键帧，通过帧率去刷每一帧的画面，这个思路跟gif很像，但是通过配置使得动画过程中图片都可以得到复用。性能就提升上来了。并且不用解析高阶插值（二次线性方程，贝塞尔曲线方程）

官网

地址

地址