空的requestAnimationFrame循环泄漏内存? [英] Empty requestAnimationFrame loop leaking memory?

查看:357
本文介绍了空的requestAnimationFrame循环泄漏内存?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个带有requestAnimationFrame循环的干净HTML文件,该文件绝对不进行任何处理.但是,如果我查看Chrome DevTools上的内存消耗,就会发现用过的内存不断增加,垃圾收集器每隔几秒钟运行一次,以收集大约1兆字节的垃圾数据.

I have a clean HTML file with requestAnimationFrame loop that does absolutely no processing. However, if I look at memory consumption on Chrome DevTools I see that used memory constantly increases and garbage collector runs every few seconds to collect around 1 megabyte of garbage data.

那么这个内存泄漏是从哪里来的?

So where does this memory leak comes from?

这就是我的内存使用情况:

That's how my memory usage looks like:

这是我的代码:

<!DOCTYPE html>
<html>
<head lang="en">
    <title></title>
    <script>

        function update() {

            window.requestAnimationFrame(update);

        }

        update();

    </script>
</head>
<body>

</body>
</html>

推荐答案

我也对此进行了调查.我之所以来到这里,是因为我注意到Chrome浏览器正在跟踪来电的来源.

I investigated this too. I came here because I noticed Chrome is tracking where calls come from.

我注意到它一直回到最初的通话

And I noticed it was going all the way back to the original call

因此,我每隔几分钟检查一次,就让它运行一个小时.它确实分配了一段时间,但最终似乎释放了一些内存.

So, I left it running for an hour checking on it every few minutes. It did allocate memory for a while but eventually seemed to release some.

我很确定这样做是为了简化其他异步代码的调试,因为这有助于了解某些异步请求从何处开始.没有那条路径,您得到的只是事件/回调被调用了,而不是它的创建位置.

I'm pretty sure it does this to make debugging other async code easier since it's helpful to know where some async request started. Without that path all you get is that your event/callback got called, not where it was created.

那说明我了解你的痛苦.众所周知24fps存在问题,电影导演倾向于避免显示那些问题的场景类型.当霍比特人" 出现并以48fps拍摄时,导演试图添加某些类型的场景以24fps失败.

That said I understand your pain. It's well known that 24fps has problems and movie directors tend to avoid the types of scenes that show those issues. When "The Hobbit" came out and was shot at 48fps the director tried adding some of the types of scenes back in that fail at 24fps.

在视频游戏中还众所周知,对于任何2D滚动游戏而言,30fps都不足够.对于进入屏幕游戏来说,它是可以通过的(在PS1,PS2,N64上以30fps的速度交付了整代游戏),但对于2D滚动游戏,整个屏幕似乎以30fps的速度快门,而在60fps的情况下显得很平滑

It's also well known in video games that 30fps is not enough for any 2d scrolling game. For into the screen games it's passable (whole generations of games shipped at 30fps on PS1, PS2, N64) but for 2d scrolling games the entire screen appears to shutter at 30fps where as it appears smooth at 60fps

无论如何,我都没有建议的解决方案.这只是浏览器的工作方式.每次创建事件(即requestAnimationFrame所做的事情)时,都必须分配一些小对象并将其放在要在将来某个时刻执行的事件列表上,而该事件本身会占用内存.特别是对于requestAnimationFrame,在特殊情况下,浏览器可能只具有几个事件的预分配队列,然后尝试回收它们,而不是使用它们用于所有其他事件(鼠标,键盘,图像加载,XHR请求)的通用系统.完成等),但是鉴于事件实际执行时,它们可能需要位于同一队列中,因此可能很难实现.

In any case I don't have a solution to suggest. It's just the way the browser works. Every time you create an event, which is what requestAnimationFrame does, some small object has to be allocated and put on the list of events to be executed at some point in the future and that in itself takes memory. For requestAnimationFrame in particular maybe the browser could special case having only a pre-allocated queue of a few events and trying to recycle them rather then use the generic system they use for all other events (mouse, keyboard, images loading, XHR requests finishing etc) but that would likely be hard to implement given that when the events actually execute they probably need to be in the same queue.

即使那样,JavaScript本身也只不过是分配内存.不这样做几乎是不可能的.调用函数会分配参数,因为参数最终会成为该函数的关闭上下文的一部分(JS引擎可能会对其进行优化,但从语言角度来看,它们会进行分配).

And even then, JavaScript itself is all about allocating memory. It's nearly impossible not to. Calling a function allocates the arguments since they end up being part of that function's closure context (JS engines might optimize that but from language perspective they allocate).

现在,浏览器开始针对要求90fps的WebVR,也许他们会想出一种新方法.也许我们都将切换到WebAssembly?

Now that browsers are starting to target WebVR which requires 90fps maybe they'll come up with a new way. Or maybe we'll all switch to WebAssembly?

¯\ _(ツ)_/¯

这篇关于空的requestAnimationFrame循环泄漏内存?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆