一直以来，每次调用Ajax方法都需要创建一次 Microsoft.XMLHTTP 对象，今天在使用Ajax技术做一个类似聊天室的demo时，发现即使没有发生任何的 DOM 动作,IE的内存占用量却一直递增。从十几M飙升到150M，因为我在页面中使用了 setInterval 函数，如果时间周期越短，内存消耗量就增加得越快。
从demo程序本身开始查，一直追查到底层的 myJSFrame 框架，发现内存的消耗发生在 new ActiveXObject('Microsoft.XMLHTTP') 的动作上，每次创建的 xmlhttp 对象都一直驻留在内存当中，只有把IE窗口最小化后内存才被回收。
郁闷了老半天，翻阅 prototype.js 亦无果，突然想到了缓存，既然无法手动回收内存，那可以把 xmlhttp 对象缓存起来嘛，页面中第一次创建的 xmlhttp 对象缓存到 ajax 对象的属性中去，第二次创建 xmlhttp 时就使用缓存中的对象！哈哈，果然，任务管理器里IE的内存占用量就停止增加了~~
var Ajax={
xmlhttp:function (){
var obj = null;
try{
obj = new ActiveXObject('Msxml2.XMLHTTP');
}catch(e){
try{
obj = new ActiveXObject('Microsoft.XMLHTTP');
}catch(e){
obj = new XMLHttpRequest();
}
}
return Ajax.xmlObjCache = obj;
},xmlObjCache:null
};
Ajax.Request=function (){
if(arguments.length<2)return ;
var para = {asynchronous:true,method:"GET",parameters:""};
for (var key in arguments[1]){
para[key] = arguments[1][key];
}
var _x=Ajax.xmlObjCache || Ajax.xmlhttp();
var _url=arguments[0];
if(para["parameters"].length>0) para["parameters"]+='&_=';
if(para["method"].toUpperCase()=="GET") _url+=(_url.match(/\?/)?'&':'?')+para["parameters"];
_x.open(para["method"].toUpperCase(),_url,para["asynchronous"]);
_x.onreadystatechange=Ajax.onStateChange.bind(_x,para);
if(para["method"].toUpperCase()=="POST")_x.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
for (var ReqHeader in para["setRequestHeader"]){
_x.setRequestHeader(ReqHeader,para["setRequestHeader"][ReqHeader]);
}
_x.send(para["method"].toUpperCase()=="POST"?(para["postBody"]?para["postBody"]:para["parameters"]):null);
return _x;
};
Ajax.onStateChange = function(para){
if(this.readyState==4){
if(this.status==200)
para["onComplete"]?para["onComplete"](this):"";
else{
para["onError"]?para["onError"](this):"";
}
}
}
xmlhttp:function (){
var obj = null;
try{
obj = new ActiveXObject('Msxml2.XMLHTTP');
}catch(e){
try{
obj = new ActiveXObject('Microsoft.XMLHTTP');
}catch(e){
obj = new XMLHttpRequest();
}
}
return Ajax.xmlObjCache = obj;
},xmlObjCache:null
};
Ajax.Request=function (){
if(arguments.length<2)return ;
var para = {asynchronous:true,method:"GET",parameters:""};
for (var key in arguments[1]){
para[key] = arguments[1][key];
}
var _x=Ajax.xmlObjCache || Ajax.xmlhttp();
var _url=arguments[0];
if(para["parameters"].length>0) para["parameters"]+='&_=';
if(para["method"].toUpperCase()=="GET") _url+=(_url.match(/\?/)?'&':'?')+para["parameters"];
_x.open(para["method"].toUpperCase(),_url,para["asynchronous"]);
_x.onreadystatechange=Ajax.onStateChange.bind(_x,para);
if(para["method"].toUpperCase()=="POST")_x.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
for (var ReqHeader in para["setRequestHeader"]){
_x.setRequestHeader(ReqHeader,para["setRequestHeader"][ReqHeader]);
}
_x.send(para["method"].toUpperCase()=="POST"?(para["postBody"]?para["postBody"]:para["parameters"]):null);
return _x;
};
Ajax.onStateChange = function(para){
if(this.readyState==4){
if(this.status==200)
para["onComplete"]?para["onComplete"](this):"";
else{
para["onError"]?para["onError"](this):"";
}
}
}
站长工具
相关文章
请稍等，评论加载中...