快速制作高性能帧动画解决方案

帧动画中含有大量的图片，通过图片优化、减少图片整体大小，将能够节省资源，提高性能。下面将一一列举优化方式及解决方案。

使用 一键图片优化并生成动画文件

GitHub:

帧动画中，有些帧使用的图片其实是一模一样的。如果能让这些帧引用同一张图片，不再重复加载展示一样的图片，那将能够减少相同图片的加载。

需要做的工作：

通过裁剪图片四周的空白区域，减少图片的大小。

需要做的工作：

为了能够减少 http 请求，减少整体帧图片的大小，可以对图片进行合图处理。

需要做的工作：

空白裁剪与去重强强联合，更加强大的优化。

在帧动画中，有些帧的区别实际上只是图片内容的移动，当对这些图片进行空白裁剪后，会发现裁剪后的图片是一致的，于是可以进行图片复用

空白裁剪+去重将能达到更多场景的图片复用，特别是当存在大量的可以经过裁剪后复用的帧，那么优化的效果非常可观。

基于空白裁剪 + 去重，最终再进行合图优化

通过 空白裁剪 + 去重 + 合图 进行图片优化，能够大大减少图片资源大小。通过最终处理后的图片与图片信息文件后，编写代码还原每帧图片展示，从而进行帧动画播放。

上面一步步的图片处理以及数据信息应该如何实现呢？

使用 ，仅需一行命令，完成下列工作

<

>

# dir 为帧图片目录

关于 的使用与介绍，请点击

转自github.com/joeyguo/blo…

文章仅作为分享