一文带你快速实现高精度动画

原文作者：UC 国际研发 衍豪

写在最前：欢迎你来到“UC国际技术”公众号，我们将为大家提供与客户端、服务端、算法、测试、数据、前端等相关的高质量技术文章，不限于原创与翻译。

背景

目前的动画形式多种多样，如 canvas、css、svg、gif、视频都是我们常见的形式，我们简单对它们做个分析：

• 手写实现 svg 和 canvas 动画，控制粒度较细，工作量大，对着效果来实现容易有买家秀和卖家秀的区别，且客户端不能复用
• css 我们经常使用来实现过渡效果、加载的动画，对于一些复杂的动画仍无法满足需求
• gif 动画，文件较大，带透明通道的容易有毛边，且只能在一个固定的尺寸里渲染，颜色数最高 256 导致画质不高，
• png 图序列，不能放大，且文件较大
• 视频，文件体积十分大，影响加载时间

由于各个动画实现方案有着各种问题，所以十分需要有一种简单、高效、