2019 年最受欢迎的10个 JavaScript 动画库

JavaScript将继续成为2019年最受欢迎和最广泛使用的编程语言,JavaScript生态系统将继续增长。

作为一名前端开发人员,当我浏览网页找到一个整洁的Javascript动画库时,我发现很多“推荐”的动画库都没有维护一段时间。经过一些研究,我收集了10个可以在您的应用程序中安全使用的最佳Javascript动画库

.Three.js

这个受欢迎的图书馆拥有超过46,000颗星,提供了许多3D显示功能,以直观的方式使用WebGL。该库提供CSS3D和WebGL渲染器,允许我们在设备和浏览器之间创建丰富的交互式体验。该图书馆于2010年4月首次推出,目前仍有近1,000名参与者正在开发中。

2. Anime.js

超过20K的星星,Anime是一个JavaScript动画库,可以处理CSS属性,单个CSS转换,SVG或任何DOM属性以及JavaScript对象。此库允许您链接多个动画属性,同步多个实例,创建时间轴等。

3.Mo.js

超过14K的星级,是Web的动态图形工具条,具有简单的声明API,跨设备兼容性和超过1500个单元测试。您可以在DOME或SVG DOME周围移动东西或创建唯一的mo.js对象。虽然文档有点稀缺,但示例非常丰富,这里有一些CSS技术的介绍。

速度

超过15k的星级,Velocity是一个快速的Javascript动画引擎,具有与jQuery的$ .animate()相同的API。它具有彩色动画,过渡,循环,画架,SVG支持和滚动。以下是Velocity高性能引擎的细分,这里是使用该库的SVG动画的介绍。

5. Popmotion

超过14K星,这个动画库的大小只有11 kb。它允许开发人员使用CSS,SVG,React,三个创建,js以及任何接受数字作为输入的API,从可以启动和停止的操作创建动画和交互。

6. Vivus

超过10k的星级,Vivus是一个零依赖的JavaScript类,它可以让你为SVG制作动画并给它们一个彩绘的外观。您可以使用许多可用动画之一或创建自定义脚本来绘制SVG。查看Vivus-instant获取真实世界的示例并自行练习。

7. GreenSock JS

GSAP是一个JavaScript库,用于创建高性能,零依赖,跨浏览器的动画,据说可用于超过400万个网站。 GSAP非常灵活,可以与React,Vue,Angular和vanilla JS一起使用。 GSDevtools还可以使用GSAP帮助构建dubug动画。

8.滚动显示

凭借15K星和零依赖关系,该库为Web和移动浏览器提供了一个简单的滚动动画,以便为滚动内容设置动画。它支持各种简洁的效果类型,甚至允许您使用自然语言定义动画。这是一个简短的SitePoint教程。

9.悬停(CSS)

超过20k的星级,Hover提供CSS3支持的悬停效果集合,用于链接,按钮,徽标,SVG,特色图像等,可在CSS,Sass和LESS中使用。您可以在自己的样式表或参考样式中复制和粘贴要使用的效果。

10. Kute.js

一个完整的原生JavaScript动画引擎,具有跨浏览器动画的基本功能。重点是代码质量,灵活性,性能和大小(核心引擎17k和gzip压缩5.5k) - 这是一个演示。该库也是可扩展的,因此您可以添加自己的功能。

感谢阅读,每天分享IT前端教学的最新信息