requestAnimationFrame 垃圾回收
Posted
技术标签:
【中文标题】requestAnimationFrame 垃圾回收【英文标题】：requestAnimationFrame garbage collection 【发布时间】：2013-06-27 06:24:05 【问题描述】：我正在使用 Chrome Dev Tools v27 中的时间轴分析以下代码的内存使用情况。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='content-type' content='text/html; charset=UTF-8' />
<title>RAF</title>
</head>
<body>
<script type='text/javascript' charset='utf-8'>
var frame = function()
window.webkitRequestAnimationFrame(frame);
;
window.webkitRequestAnimationFrame(frame);
</script>
</body>
</html>
请注意，这很简单。但最终我看到了一个牙齿图案，表明垃圾收集器正在回收内存。
raf 默认会创建垃圾对象吗？有没有办法避免这种情况？谢谢。
【问题讨论】：
相关。这方面似乎存在更多潜在问题。我建议也许对整个内存监控工具的输出持保留态度？老实说，我真的不确定从中得出什么结论。 ***.com/questions/19395565/… 【参考方案1】：我发现了以下内容： 如果您将 RAF 功能更改为两个类似“乒乓”的功能，您会得到更少的垃圾。您无法避免第一次初始“大 GC”，但之后您只会看到大约 50kb 的次要 GC，而不是 700kb-1mb 的 GC。代码将如下所示：
<script type='text/javascript' charset='utf-8'>
window.frameA = function()
window.webkitRequestAnimationFrame(window.frameB);
;
window.frameB = function()
window.webkitRequestAnimationFrame(window.frameA);
;
window.webkitRequestAnimationFrame(window.frameA);
</script>
我想这是您在 Chrome 中可以做到的最好的事情。 我注意到在 FF 中 gc 间隔或内存几乎没有变化，因此它可能与 chrome 调试有关（有关更多详细信息，请参阅上面链接的 chrome 错误报告）。然而，当我像这样部署 RAF 时，我注意到我自己的游戏有所改进 - 哎呀，我需要能够在没有人工 GC 的情况下调试它，而这在普通用户的机器上是不会发生的。
【讨论】：
我很震惊地说这行得通。惊人的发现，我什至无法想象是什么让你尝试这个。 :) Kevzettler: 总有一天它会（希望）过时。你能告诉我们你测试的是哪个浏览器版本吗？您是否仍然普遍观察 gc 问题？我会相应地编辑答案。【参考方案2】：我认为 Chrome 可能有问题...
这里已经报告了类似的错误：
https://code.google.com/p/chromium/issues/detail?id=120186
【讨论】：
【参考方案3】：它看起来像一个保留循环。 Frame 正在调用自身，因此保留了一个保留计数并且不会被释放。此外，无论何时您使用配置文件、时间线或堆堆栈监控正在运行的代码，都会产生一些副作用。
无论如何我都不会担心。如果您试图让您的应用程序或页面具有更高的性能，则需要解决更大的问题。只要 JS 在 16 毫秒内完成，就没有人会注意到任何事情。
最大的内存/CPU 问题是：网络调用、解压缩 PNG/JPG、创建和销毁 DOM 元素、在非工作线程上处理/解析数据、GPU 纹理使用不当以及分配大量数据导致 GC需要很长时间才能收集数据。
我能够优化包含 1,000,000 个项目的滚动列表，使其在 chrome (https://github.com/puppybits/BackboneJS-PerfView) 上以 120FPS 的速度运行。性能工具应该可以帮助您找到用户可以看到的最大问题，而您无需担心次要问题。
【讨论】：
你好！你知道如何将这个想法用于 rAF 动画吗？以上是关于requestAnimationFrame 垃圾回收的主要内容，如果未能解决你的问题，请参考以下文章