Javascript内存使用管理

Question

我正在构建大型网站,使用大量的javascript,我的所有内容都被加载ajax,它与facebook非常相似,而且由于有很多不同的页面,我需要大量的javascript,所以我想到的是划分我的脚本在各个部分中,每个页面都有自己的脚本文件.

现在加载很简单,我只是为每个页面加载一个新文件,但我担心如果用户通过100个不同的页面加载100个不同的脚本文件会发生什么？

目前我的网站没有那么多页面,但我很确定它将来会在某个时候发展到近100个独特的页面.

那么用较慢的计算机的用户会发生什么？我猜它会开始放慢很多,因为没有刷新.根据我的阅读,不可能以任何简单的方式从加载的脚本文件中卸载所有事件和数据,如果我尝试这样做可能会花费我很多时间和精力来做到这一点.

所以我的问题是,我应该保留它的方式还是尝试做点什么呢？我目前正在使用jquery几个插件,如果我不得不猜测平均文件将是大约50-200行代码,主要是click事件和ajax调用.

请注意,每个页面对象都有它自己的前缀为每个类,例如:home_header,login_header

所以onClick事件监听器和类似的东西之间不应该有任何冲突.

编辑我在这个问题上设置了赏金,我希望听到更多的意见.

Answer 1

仅仅因为你使用AJAX并不会自动意味着关于内存使用的警钟......你应该更担心导致内存泄漏的事情,并确保你破坏以及正确构建事物:

• http://javascript.crockford.com/memory/leak.html
• http://nesj.net/blog/2012/04/javascript-memory-leaks/

• http://www.ibm.com/developerworks/web/library/wa-memleak/

• 什么是JavaScript垃圾收集？

作为一项规则,在任何大型系统中,我倾向于创建一个帮助器构造函数,用于跟踪我可能希望在以后销毁的所有项目或者在页面卸载(事件侦听器,大型属性或对象结构)上的所有项目,这些项目都由命名空间编制索引.然后当我完成一个特定的部分或实体时,我问帮助器系统 - 我称之为GarbageMonkey :) - 清除特定的命名空间.

1. 对于它解开的事件
2. 对于属性,它取消设置
3. 对于数组/对象,它会扫描和取消设置每个键,也可以为子元素执行此操作
4. 对于元素,它会尽可能地删除和清除内容

显然,对于上述工作,你需要警惕留下变量,可以保留对你希望删除的数据的引用.所以这意味着要知道什么是垃圾收集,什么是关闭 ; 他们之间如何保持变量永远活着!! ..或至少直到浏览器/选项卡被销毁.它还意味着使用对象结构而不是变量,因为您可以删除任何可以访问该对象的范围中的键,但是您不能对变量进行删除.

这样做:

var data = {}, methods = {}, events = {};

methods.aTestMethod = function(){
  /// by assigning properties to an object, you can easily remove them later
  data.value1 = 123;
  data.value2 = 456;
  data.value3 = 789;
}

而不是这个:

var value1, value2, value3;

var aTestMethod = function(){
  value1 = 123;
  value2 = 456;
  value3 = 789;
}

原因是因为在上面你可以稍后这样做:

var i;
for( i in methods ){ delete methods[i]; }
for( i in data ){ delete data[i]; }

但你不能这样做:

delete value1;
delete value2;
delete value3;

现在显然上面的内容不会保护你免受直接指向其中一个methods或哪个子元素的引用data.但是如果你只在代码中传递methods和data对象,并且在将方法作为事件监听器附加方面保持整洁,那么即使你最终得到一个流氓引用它也应该只指向一个空对象(在你删除之后)它的内容是).

Answer 2

如果您回收变量并且不污染全局范围,那么您就处于正确的轨道上; 但至于你的问题,你应该首先找出它是否是一个实际问题.

这可以通过分析器进行检查和监控 - 开箱即用Chrome非常不错,只需键入about:memoryURL,它就会为您提供每个标签的细分,甚至可以让您比较浏览器之间的内存使用情况.如果您设置了一些自动化测试方案(或者愿意手动浏览100页),则此类概要分析将告诉您网站是否存在严重错误.