【发布时间】：2019-09-17 07:56:08
【问题描述】：
是否有针对屏幕外无限运行的 CSS 动画的任何浏览器内优化（无限动画应用于文档中存在/显示的元素，只是不在视图中某个时间）？
为了更直接的讨论，我将提及仅涉及合成的 CSS 动画：仅使用变换和/或不透明度。
如果我们有一个 CSS 动画，它有animation-timing-function: infinite;，如果动画元素实际上不在屏幕上/视图中，它如何处理？
有一些关于动画的已知场景与此用例无关：
- 如果将浏览器选项卡推到后台，动画将暂停。 MDN
- 如果元素从 Document 中移除，动画将被忽略，类似于
display: none;（找不到可引用的源 atm）；
如果元素只是“超出滚动范围”，并且用户可以在元素离开屏幕期间随时到达它：
无论元素是否可见，动画是否正常运行，消耗相同？
它是否正常运行，但由于未绘制，过程本身变得更便宜？ - 会更有意义。
动画是否完全暂停？ - 假设不会，因为浏览器必须知道元素需要再次绘制时的“当前进度”。
或者在满足这些条件时，是否有任何其他浏览器内进程对此进行优化？
非常感谢任何记录在案的答案，或任何对某些资源的重定向，这可以阐明这个问题。
本次讨论将有助于确定：手动删除无限动画（对于屏幕外的元素）是否值得考虑，以获得更好的性能。
【问题讨论】：
-
有趣的问题。然而，动画可以在离开屏幕时暂停，并根据它进入视野时的启动时间重新开始。不知道是不是这样，只是提到它确实可以跟踪时间。
-
我相信我从 CSS 人员那里听到了关于它的讨论。但不要回忆“计划细节”。当他们创建解决方案时，我希望将其共享给 Javascript 世界；通过询问浏览器脚本正在处理的元素是否可观看，可以将资源保存在 Javascript 端。
标签： css css-animations