动效解决方案

1. Gif / APNG / WebP

• 优点：简单方便，兼容性好，支持透明。

• 缺点：仅支持8bit索引色（256色），可能导致颜色失真和锯齿；体积较大；只能循环播放。

• 优点：支持半透明，颜色还原度高，体积较小。

• 缺点：兼容性较差；只能循环播放，但可通过转成Canvas绘制实现播放和暂停。

• 优点：提供高压缩率和良好图像质量，支持透明度和动画。

• 缺点：兼容性较差；只能循环播放，但可通过转成Canvas绘制实现播放和暂停。

2. 帧动画

• 优点：可以自由控制播放、暂停、帧速率、动画时长。

• 缺点：在动画帧率较高时，需要请求大量图片资源，可能导致弱网状态下动画卡顿。

3. Video视频

• 适用于直播软件中的全屏礼物特效，但Web支持度不佳。

• 适用于全屏背景动画，需要设计师提供全屏静音视频。

• PC端：自动播放限制不多，只需默认静音。

• 移动端：自动播放限制严格，建议使用Canvas绘制视频。

4. 骨骼动画

• 使用Spine和DragonBones软件制作，支持Web端播放。

• Spine动画可通过pixi-spine集成进Web项目。

5. Live2D

• 应用于电子游戏的绘图渲染技术，可制作细腻人物动效。

• 推荐使用pixi-live2d-display进行项目集成。

6. SVGA

• YY直播团队开源的跨平台动画格式，兼容iOS/Android/Web。

• 动画设计师通过工具输出svga动画文件，开发工程师集成svga player后使用。

7. Lottie

• Airbnb开源的跨平台动画库，支持Android、iOS、Web等。

• 通过AE的Bodymovin插件导出JSON文件，实现动画效果，动画还原度100%。

8. 游戏引擎

• 使用Oasis、Cocos、Unity等游戏引擎，提供真实物理效果。