前端是否有办法根据用户设备性能自动减弱过渡动画效果？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

• 请不要在回答技术问题时复制粘贴 AI 生成的内容

2 条回复 • 2025-04-27 19:58:53 +08:00

3 小时 13 分钟前

CSS 动画和 requestAnimationFrame 都是“浏览器认为的最佳动画时机”，除此之外 prefers-reduced-motion 表明用户不想看动画（比如晕动画的人），除此之外 setTimeout 的运行时机实际上也不会超过客户端的性能。

3 小时 3 分钟前

有个 Long Animation Frames API ，可以在动画和响应掉帧的时候调用指定回调： https://developer.mozilla.org/en-US/docs/Web/API/Performance_API/Long_animation_frame_timing

可以设置一个 threshold ，比如掉帧在 5s 内超过 10 次就改为弱动画。