PAG究竟是怎么解决它们的？
我们与PAG的研发团队、腾讯PCG发布器中台下编辑子工作组的负责人Dom取得了联系，了解了背后的实现原理。
PAG背后的技术门道Dom表示，PAG早期最有挑战的地方，其实就在于“动画文件设计”和“全AE特性支持”这两部分。
高效动画文件
在输出文件格式方面，已有的JSON等格式存在两大问题：解码速度慢、压缩率低。
为此，团队重新设计了一种名为.pag的文件格式，采用二进制数据结构来存储动画信息。
一方面，二进制数据结构不需要做字符串匹配、序列化等操作，解码速度会比JSON等格式的文件快上许多。测试数据显示，在解码速度上，PAG格式的动画文件要比JSON文件快12倍。
另一方面，相比于JSON，二进制数据结构具有更高的压缩率。
JSON文件导出的冗余信息较多，而二进制的数据结构则能跳过大量默认值存储，并使用动态比特位来紧凑存储。因此相同的动画内容，PAG文件比同类型方案压缩文件小50%左右。
此外，采用二进制数据结构还有一个额外的好处，在导出动画文件时不用再搭配“图片包”（外挂图片），一个文件就能搞定，包括音频也能够内置。
文章插图
全AE特性支持
说完文件格式，再来看看PAG文件是如何做到支持所有AE效果的。
这个特性使得PAG文件既能实时预览复杂特效，又能确保动画的可编辑性，但在之前，它们并不能同时被实现。
这是因为传统的动画的导出模式有两种，即矢量导出和序列帧导出。
矢量导出的动画文件具有可编辑性，但缺点是一些复杂特效无法在移动端实时预览，因此无法做到全AE特性支持。
序列帧导出基于截图的原理解决了这个问题，也就是将复杂的视觉动效全部截成图片，再实现导出。但这就导致文件大小可能高达几十上百兆，对移动端而言“又大，又没法编辑”。
为了让文件既可以编辑，又能保证精彩动态效果的实现，PAG的研发人员们想到了混合导出的方法。
简单来说，就是给不需要可编辑性的图层打标记。这样在导出时，需要保留编辑性的图层就会以纯矢量形式被导出，而打了标记的图层，则以序列帧的方式导出。
文章插图
值得一提的是，为了尽可能压缩导出文件的大小，PAG团队还自己设计了bmp预合成的格式，充分利用了视频的极限帧间压缩能力，并在此基础上扩展了对透明通道的支持。
再加上渲染方面的优化，最终，相比于传统图片序列帧，视频序列帧格式的文件大小可以降低到原来的1.24%左右。
文章插图
但从基础功能的实现，到如今成为一整套完整的工具流，PAG并非“一蹴而就”。
与之相反，虽然SDK去年才开始对外开放，但早在2016年，PAG的第一行代码就已经写下。
从最初的1.0版本迭代到如今的形态，PAG已经走过了4个版本。
“被battle出来的产品”“从写下第1行代码，到第1次跑通，团队就用了6个月时间。”
至于为何要选择坚持打磨这样一款工具产品，Dom提到了一个“回忆杀”的词语Flash：
在Flash时代，动效开发有一套非常完善的工作流：设计师把动画制作出来，导出一个SWF文件，开发人员无需手敲代码还原效果，直接导入就能使用。并且动效里面的细节是可以调整的。
但到了现在的H5、移动应用开发里，很少有工具能够完整还原这套完善的动画工作流。
相关经验推荐
- 彼端|cos：王者荣耀妲己时之彼端cos正片@秋楚楚
- 公孙离|cos：王者荣耀公孙离国风少女cos正片@nico酱
- 光之国|光之国的王牌，科技改变力量，希卡利是如何一步步成为王者的呢？
- 甄姬|cos：王者荣耀甄姬游园惊梦cos正片@小鱼
- 公孙离|cos：王者荣耀公孙离花间舞cos正片@四娘
- kpl|cos：王者荣耀上官婉儿kpl限定皮肤天狼绘梦者cos正片
- |cos：王者荣耀西施cos正片@敲可爱哒nico酱
- 同人|cos：王者荣耀虞姬启明星使同人cos正片@温流
- |cos：王者荣耀美女貂蝉cos正片@押切
- 德拉西翁|奥特曼最新排名，特利迦是黄金，神秘四奥是钻石，王者只有一个！