JavaScript 内存在浏览器中是如何工作的？答案

【问题标题】：How does JavaScript memory work in browsers?JavaScript 内存在浏览器中是如何工作的？
【发布时间】：2010-12-12 07:34:06
【问题描述】：

在构建高级 JS 接口和游戏时，我发现我必须更深入地研究浏览器如何处理 JS 的内存。我在内存和 JavaScript 方面的经验是，在以下情况下内存会阻塞（并使动画和计算变慢/滞后）：

因此，我得出的结论是，如果我想保持记忆新鲜，我应该从文档的开头包含尽可能多的 HTML 代码，因为它将被缓存而不是保存在内存中。当然，删除所有当前未使用的元素。

有人知道这方面的更多信息吗？资源？链接？

【问题讨论】：

“缓存而不保存在内存中”到底是什么意思？这对我来说没有任何意义。
我不是这方面的硬件专家。我想我认为如果从缓存或内存中读取文件是有区别的。但话又说回来，也许所有缓存的文件都通过内存传递。或者在本例中，内存可能与缓存相同。正如我所说，我真的不知道这一切是如何结合在一起的。这就是我问的原因:)

【解决方案1】：

注意事项：

IE 被 DOM 复杂性杀死。页面中的元素越多，速度就越慢。我已经看到页面速度明显变慢，只有 3000 个元素（如果您有一个包含 10 列和 100 行的网格，那么那里就有 1000 个元素）。正确的方法通常是从 DOM 中卸载隐藏部分（分离它们）
如果 HTML 元素附加了 javascript 处理程序，IE 也有很长的历史不能正确释放它们。如果您有一个经常刷新的长期页面，请阅读 IE 内存泄漏以及如何解决这些问题。
所有浏览器都将未压缩的图像存储在内存中。因此，如果您要在后台预加载海量的大图片，这通常是个坏主意。
更新 DOM 属性会导致页面重排，这在复杂页面上可能需要很长时间。有时甚至获取 DOM 属性（例如 offsetHeight）也会非常缓慢。

一般来说，javascript 本身并不是性能瓶颈。扼杀它的是与 DOM 的交互。不接触 DOM 的代码很少会出现性能问题。这里只有经验法则：尽可能少地与 DOM 交互，尽可能降低 DOM 复杂性，避免重复的页面重排。

【讨论】：

好的。所以与 DOM 的交互也是一个问题。尤其是大的。很高兴知道。如果我更改/减少 DOM 树会发生什么？这会增加内存（存储修订？）还是真的减轻了负担？ “页面重排”是指根据视觉格式化模型更新所有文档元素？
您可能会发现这很有用：slideshare.net/lsimon/go-with-the-reflow，另外，这个：library.mozilla.org/…
DOM 树未修订。如果你从 DOM 树中分离出一些东西，并且没有从 javascript 中留下任何引用（不像听起来那么容易，因为原型链），那么它将被垃圾收集。
太棒了！我仍然可以手动垃圾收集它以确保以某种方式？我记得在过去，人们在 IE 中的某些情况下就是这样做的。
我想知道重要的是否只是对 DOM 的结构更改，例如删除或添加新元素。还是对现有属性（如类属性）的更改也强制重绘？伙计，我感谢专家的信息！ :)

【解决方案2】：

对于初学者。所有 HTML，无论是否“从头开始包含”，都保存在内存中。很可能还有当前页面的所有图像内容。至少，您在任何给定时间在屏幕上看到的所有内容都会保存在当时的内存中。

【讨论】：

我只是认为浏览器处理内存的方式是有限制的。我的意思是，在遇到滞后问题之前，您可以在 flash 中编写比在 JavaScript 中更密集的脚本。有什么东西阻碍了我的脚本编写吗？一般对浏览器脚本的一些限制？
您可以在 Flash 中编写更密集的脚本，因为它有一个非常快速的脚本引擎。该引擎的一个变体（Tamarin）现在在 Firefox 中，而 Safari 和 Chrome 都有自己的新引擎，速度快得离谱。唉，Internet Explorer 有点落后了。
啊，我c。所以它的引擎又慢又旧。图。我真的很喜欢 Chromes 引擎。

【解决方案3】：

老实说，它往往更多地取决于你用它做什么。如果您不与它们进行交互，许多图形不会对 javascript 进行下蹲，但是如果您有一个充满不同元素的巨大页面，并且您正在整个文档中搜索单个元素，那么情况就不同了完全的事情。

我在向页面添加大量事件等操作时遇到了问题。在一个页面中运行了太多的循环和太多的计时器。

如果 javascript 性能是一个问题，并且您计划使用密集的 javascript，您可能需要查看 webworkers。这里还有一些关于 webworkers 的链接：

【讨论】：