我花了整个周末来详细说明我用 Dojo 编写的 Web 应用程序中的内存增长问题。
Web 应用程序将“永远运行”，因此不打算重新启动浏览器。
应用程序定期从服务器（非跨域）更新动态数据；每 5 秒进行一次 AJAX 调用以将新数据检索为 JSON。
通过让应用程序运行几个小时，我观察到浏览器内存不断增长（在最新的 Chrome 和 Firefox 上，在最新的 Windows 和 Mac OS X 上）。
起初，我认为是 Dojo 导致了这种行为。事实上，通过使用 XMLHttpRequest 对象切换到本机实现，我可以显着减少内存增长，但它仍然存在。对于每个 AJAX 请求，内存都会增长一点（大约 4-8KB）。
我已经尝试过的：
我有...
- ...尝试使用其他框架，例如 jQuery、YUI 等- 没有效果
- ...切换到使用本机 `XMLHttpRequest` 对象- 帮助很大，但不完全
- ...在检索数据后停用 DOM 操作- 无效
- ...通过设置为 `null` 并在每次迭代后将其删除来重置 `xhr` - 无效
- ...在每次迭代后将 onreadystatechange 处理程序重置为 null 或空方法- 无效
- ...重用了 `xhr` 对象和 `onreadystatechange` 处理程序，因为它总是相同的- 没有效果
因此，即使我对加载的数据什么都不做（如下面的第一个 StackOverflow 链接中所述），内存使用量也会增加：
我已经阅读的内容：
- 带有 XMLHttpRequest 和 setInterval 的内存泄漏
- 使用 XMLHttpRequest 自动刷新网页内存泄漏
- 包装的 XMLHttpRequest 函数的内存泄漏
- http://forum.jquery.com/topic/memory-leaks-with-ajax-calls
- 以及更多...
我的测试 HTML 代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Native XHR Async</title>
</head>
<body>
<script>
var update = document.createElement("div");
document.body.appendChild(update);
var timeout = null;
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = onReadyState;
function loadData()
{
xhr.open("GET","memory-leak.json?" + new Date().getTime());
xhr.send(null);
}
function onReadyState()
{
if (this.readyState === 4)
{
if( this.status === 200 )
{
update.innerHTML = "";
update.innerHTML = this.responseText;
}
if( timeout !== null )
{
clearTimeout(timeout);
delete timeout;
}
timeout = setTimeout(loadData, 1000);
}
}
loadData();
</script>
</body>
</html>
还有我的测试 JSON（在同一目录中）：
{
"errorstatus":"Okay",
"B0":{"P":"0 Watt"},
"E0":{"P":"28 Watt"},
"Z0":{"P":"28 Watt"},
"S0":{"P":"0 Watt","SOC":"74%"},
"Z1":{"P":"0 Watt"},
"R0":0,
"R1":0,
"R2":0,
"date":"29.09.2012 09:23:19",
"Version":"Sep 28 2012-15.22"
}
我对此问题没有任何解释，因此非常感谢任何帮助。如果您需要有关此的任何进一步信息，请随时问我。