使用jQuery Ajax功能時(shí)需要注意的一個(gè)問題(內(nèi)存溢出)
更新時(shí)間:2012年05月30日 15:26:18 作者:
最近發(fā)現(xiàn)jQuery越來越火,用它的人也越來越多。jQuery最強(qiáng)大的亮點(diǎn)莫過于它的CSS3 selector和極其簡(jiǎn)單的Ajax請(qǐng)求調(diào)用
最近一哥們?cè)谧鲆粋€(gè)Ajax長連接的項(xiàng)目,頁面需要和服務(wù)器保持長連接,而且在連接超時(shí)后需要重新請(qǐng)求連接,過程中他問我要用到什么,我也是想都沒想就告訴他用jQuery。jQuery不是有ajaxSuccess ajaxError這些對(duì)象嗎,在請(qǐng)求完成或者請(qǐng)求失敗后重新請(qǐng)求不就好了。
但是后來他告訴我說沒有用 jQuery,自己手工寫的XMLhttprequest 。他告訴我說,開始是用jquery寫的,而且在測(cè)試過程中也沒有出現(xiàn)問題。但是在后來無意中發(fā)現(xiàn),在頁面開的時(shí)候久了之后,瀏覽器資源竟然占用非常高導(dǎo)致內(nèi)存不足而崩潰了。后來抓包分析發(fā)現(xiàn),每次jquery的Ajax請(qǐng)求都會(huì)創(chuàng)建一個(gè)xmlHttprequest對(duì)象,理論上講,長連接的請(qǐng)求是一個(gè)無限遞歸,請(qǐng)求數(shù)量是非常大的,但是由于每次請(qǐng)求都會(huì)建立一個(gè)新的xmlhttprequest,而且jquery不會(huì)自動(dòng)回收資源,所以導(dǎo)致了內(nèi)存溢出。
通過查看jquery API,發(fā)現(xiàn)jquery還有一個(gè) complete對(duì)象,是請(qǐng)求完成后回調(diào)函數(shù) (請(qǐng)求成功或失敗之后均調(diào)用)。 同時(shí)有兩個(gè)參數(shù)XMLHttpRequest, textStatus。所以,我們只需要在請(qǐng)求完成后,將傳回的XMLHttprequest對(duì)象手工回收即可,代碼如下:
$.ajax({
url: "http://www.dbjr.com.cn",
data: { name: "xxxx" },
dataType: "xml",
success: function (data, textStatus) {
//do something...
},
complete: function (XHR, TS) { XHR = null }
});
但是后來他告訴我說沒有用 jQuery,自己手工寫的XMLhttprequest 。他告訴我說,開始是用jquery寫的,而且在測(cè)試過程中也沒有出現(xiàn)問題。但是在后來無意中發(fā)現(xiàn),在頁面開的時(shí)候久了之后,瀏覽器資源竟然占用非常高導(dǎo)致內(nèi)存不足而崩潰了。后來抓包分析發(fā)現(xiàn),每次jquery的Ajax請(qǐng)求都會(huì)創(chuàng)建一個(gè)xmlHttprequest對(duì)象,理論上講,長連接的請(qǐng)求是一個(gè)無限遞歸,請(qǐng)求數(shù)量是非常大的,但是由于每次請(qǐng)求都會(huì)建立一個(gè)新的xmlhttprequest,而且jquery不會(huì)自動(dòng)回收資源,所以導(dǎo)致了內(nèi)存溢出。
通過查看jquery API,發(fā)現(xiàn)jquery還有一個(gè) complete對(duì)象,是請(qǐng)求完成后回調(diào)函數(shù) (請(qǐng)求成功或失敗之后均調(diào)用)。 同時(shí)有兩個(gè)參數(shù)XMLHttpRequest, textStatus。所以,我們只需要在請(qǐng)求完成后,將傳回的XMLHttprequest對(duì)象手工回收即可,代碼如下:
復(fù)制代碼 代碼如下:
$.ajax({
url: "http://www.dbjr.com.cn",
data: { name: "xxxx" },
dataType: "xml",
success: function (data, textStatus) {
//do something...
},
complete: function (XHR, TS) { XHR = null }
});
您可能感興趣的文章:
- IE下使用jQuery重置iframe地址時(shí)內(nèi)存泄露問題解決辦法
- jquery不會(huì)自動(dòng)回收xmlHttpRequest對(duì)象 導(dǎo)致了內(nèi)存溢出
- JQuery1.4+ Ajax IE8 內(nèi)存泄漏問題
- JQuery Dialog的內(nèi)存泄露問題解決方法
- js內(nèi)存泄露的幾種情況詳細(xì)探討
- Javascript 閉包引起的IE內(nèi)存泄露分析
- 容易造成JavaScript內(nèi)存泄露幾個(gè)方面
- 權(quán)威JavaScript 中的內(nèi)存泄露模式
- 關(guān)于js內(nèi)存泄露的一個(gè)好例子
- jQuery內(nèi)存泄露解決辦法
相關(guān)文章
jQuery實(shí)現(xiàn)簡(jiǎn)單倒計(jì)時(shí)功能的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)簡(jiǎn)單倒計(jì)時(shí)功能的方法,涉及jQuery根據(jù)時(shí)間動(dòng)態(tài)操作頁面元素的相關(guān)技巧,需要的朋友可以參考下2016-07-07jQuery實(shí)現(xiàn)CheckBox全選、全不選功能
這篇文章主要介紹了jQuery實(shí)現(xiàn)CheckBox全選、全不選功能,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友參考下吧2017-01-01jquery ajax post提交數(shù)據(jù)亂碼
今天發(fā)現(xiàn)在使用jquery ajax.post提交數(shù)據(jù)時(shí)會(huì)發(fā)現(xiàn)數(shù)據(jù)在ff正常,但在chrome與ie瀏覽器中post過去的數(shù)據(jù)全部是亂碼2013-11-11Jquery全選與反選點(diǎn)擊執(zhí)行一次的解決方案
在做項(xiàng)目時(shí)遇到一個(gè)bug,checkbox全選與反選功能,只能點(diǎn)擊一次,再點(diǎn)就不起作用了,為了解決此問題,我查找了好多資料,下面把具體解決方案整理分享給大家,需要的朋友可以參考下2015-08-08JQuery實(shí)現(xiàn)樣式設(shè)置、追加、移除與切換的方法
這篇文章主要介紹了JQuery實(shí)現(xiàn)樣式設(shè)置、追加、移除與切換的方法,涉及jQuery樣式操作的常用技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-06-06jQuery EasyUI學(xué)習(xí)教程之datagrid點(diǎn)擊列表頭排序
這篇文章主要介紹了jQuery EasyUI學(xué)習(xí)教程之datagrid點(diǎn)擊列表頭排序的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-07-07詳解jQuery向動(dòng)態(tài)生成的內(nèi)容添加事件響應(yīng)jQuery live()方法
這篇文章主要介紹了jQuery向動(dòng)態(tài)生成的內(nèi)容添加事件響應(yīng)jQuery live()方法,需要的朋友可以參考下2015-11-11