在毫秒内连续更新Web动画的currentTime属性会对性能/效率产生什么影响？
我想做的是将网络动画的当前时间点与用户在屏幕上平移手指联系起来。通常，这是通过从指针移动事件调用requestAnimationFrame并直接在元素上设置css属性来完成的。但是，我想用网络动画代替。
let animatedObj = animatedEl.animate(props, timing)
animatedObj.pause()
el.addEventListener('pointermove', (event) => {
animatedObj.currentTime = (.... percentage of pointer position ....)
})
但是，与requestAnimationFrame和直接设置css属性相比，它更容易出现jank或电池能量密集型问题吗？设置currentTime不是为了在ms内持续更新而设计的吗？在设置动画的currentTime时使用requestAnimationFrame会更好吗？
以这种方式设置currentTime是完全可以接受的，理论上应该比直接设置CSS属性的性能略高，因为不需要在每一帧上重新解析CSS属性值。然而，在实践中，这种差异应该可以忽略不计。通过使用Web动画，您还可以使用缓和效果等，这可能是一个优势。
我假设您的示例中的animatedObj已暂停。通过暂停它，可以确保在平移位置不变时不会不必要地触发样式更新。
通过使用requestAnimationFrame，您可以确保在样式更新之前(但在动画时间更新之后(运行回调，在某些情况下，这可能意味着您可以避免两次污染和更新样式，从而产生更好的性能。不过，最终它将取决于您的应用程序，因为它可能会通过从getComputedStyle、innerHeight等读取值来刷新样式。
此外，通过使用requestAnimationFrame，您可以确保每帧只更新一次样式，即使多个事件到达同一帧。
请注意，性能仍然无法与定期播放的Web动画相匹配，因为与常规动画不同，浏览器无法将此手动驱动的动画卸载到合成器(这可能会减少电池使用量，因为样式不需要在主线程上更新(。即将推出的滚动链接动画功能应该会对此有所帮助。