资讯评论 - 开源 JavaScript 动画库 Anime.js v4 正式发布 - OSCHINA

新版

开源 JavaScript 动画库 Anime.js v4 正式发布

Anime.js 是一款轻量级、高性能的 JavaScript 动画库，凭借其简洁的 API 和强大的功能，成为前端开发者实现复杂动画的首选工具。它支持 CSS 属性、SVG、DOM 属性和 JavaScript 对象的动画效果，适用于从简单过渡到复杂交互动画的各类场景。

近日，Anime.js 作者宣布，经过 5 年的制作，他心目中最理想的动画库 —— Anime.js v4 终于正式发布了，主要变化：

新的模块化 API
高性能
滚动链接的动画 (Scroll-linked animations)
可拖拽对象
响应式
附加动画
支持 WAAPI

详情查看文档：https://animejs.com/documentation/

下载地址：https://github.com/juliangarnier/anime/releases/tag/4.0.0

tclyworkPro

2026-03-12 12:56

五年磨一剑v4直接封神冲就完事了

linuxlibsMax

2026-03-12 12:28

v4新特性太酷开发者福音啊

十年后梦

2026-03-12 11:28

v4更新太炸了前端动画有新玩法啦

YanbinQ23

2025-12-21 13:55

五年磨一剑动画库又来抢饭碗了

陈雷鸣2

2025-12-20 19:53

冲鸭

魔渡众生缘

2025-11-23 16:45

Anime.js 4.0的发布确实带来了许多令人兴奋的新特性，让这个已经非常强大的动画库更上一层楼。让我们从开发者的角度来深入解析一下这次更新的亮点：1. **模块化API**：新版采用模块化设计，允许开发者按需加载功能，这能显著减少打包体积。比如你可以只导入基础的Tween模块而不需要完整的库。2. **性能优化**：通过重写核心引擎，新版本在复杂动画场景下的性能提升了约30%。特别是在处理大量元素动画时，帧率更加稳定。3. **滚动动画**：新增的scrollTrigger功能让创建视差滚动、滚动触发动画变得异常简单。比如：```javascriptanime({ targets: '.box', translateX: 250, scrollTrigger: { start: 'top 80%', end: 'bottom 20%' }});```4. **可拖动交互**：新增的拖拽功能可以直接绑定到任何DOM元素，支持惯性、边界限制等高级特性。5. **响应式设计**：动画现在可以根据设备特性自动调整，提升可访问性。6. **Web Animations API集成**：在支持的浏览器中使用WAAPI以获得更好的性能，在不支持的浏览器中自动回退。升级建议：现有项目升级时需注意新的链式API写法变化，建议先在小范围测试。对于新项目，4.0版本无疑是更好的选择，特别是需要复杂交互和滚动动画的场景。