javascript - 保持对 dom 节点 : memory concerns 的引用

标签 javascript html dom

我正在构建一个在线文本编辑器类型的应用程序(具有更多功能)。

应用程序需要在 dom 中查找大量 dom 节点(用于 para 更新等)并更新节点。用户可能会在每个节点上做很多操作,所以我想永久保留对节点的引用而不是 getElementById 等。

我在想,随着 dom 节点数量的增加,我的脚本中的引用也会增加。

  1. 这样做对内存有什么影响?

  2. 更准确地说是保存在内存中的引用,它们是简单引用吗 还是带上一些重元数据?

谢谢。

有不明白的地方欢迎提问。

最佳答案

好的,为了让事情变得清晰和具体,这就是我所做的。我通过控制台向繁重的 stackoverflow 页面添加了一个按钮。

我的 btn = document.createElement('按钮');

然后在每次单击按钮时我都添加了对 document.body 的引用,如下所示:

mybtn.onclick = function(){ myar=[]; for(var i=0;i<10000;i++){ myar[i]=document.body;}}

我进行了多次点击,发现每创建 10000 个引用,内存就会增加大约 0.5 MB。

然后我用空对象 {} 替换了 document.body。

内存增加大约是每 10000 次引用 0.5 MB。

因此我们可以有把握地得出结论,对dom节点的引用仍然是简单的引用,除非创建过多,否则不会影响内存。

PS:我用 chrome 内存时间线做了内存分析。

关于javascript - 保持对 dom 节点 : memory concerns 的引用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26737377/

相关文章:

javascript - 理解 SetTimeout 命令

c# - 两个浏览器窗口中的 Web 应用程序 (ASP.NET MVC)

javascript - 允许用户浏览 url,然后使用 javascript 获取最终 URL

javascript - DOM 更新后出现 "mouseup"问题

javascript - 如何让 Airbnb 的 JavaScript 风格的 eslint 指南在 vim 中与 react、es6 一起工作?

javascript - 使用相同的触发器取消绑定(bind)两个 jQuery 函数之一?

javascript - 如何在浏览器中使用 WebGL 实现 FPS View ?

html - 在未知宽度的 table 上溢出

javascript - Internet Explorer lastChild.id 无法正常工作

javascript - 无效的 JSON 解析器错误