使用jQuery Ajax功能時(shí)需要注意的一個(gè)問(wèn)題(內(nèi)存溢出)
更新時(shí)間:2012年05月30日 15:26:18 作者:
最近發(fā)現(xiàn)jQuery越來(lái)越火,用它的人也越來(lái)越多。jQuery最強(qiáng)大的亮點(diǎn)莫過(guò)于它的CSS3 selector和極其簡(jiǎn)單的Ajax請(qǐng)求調(diào)用
最近一哥們?cè)谧鲆粋€(gè)Ajax長(zhǎng)連接的項(xiàng)目,頁(yè)面需要和服務(wù)器保持長(zhǎng)連接,而且在連接超時(shí)后需要重新請(qǐng)求連接,過(guò)程中他問(wèn)我要用到什么,我也是想都沒(méi)想就告訴他用jQuery。jQuery不是有ajaxSuccess ajaxError這些對(duì)象嗎,在請(qǐng)求完成或者請(qǐng)求失敗后重新請(qǐng)求不就好了。
但是后來(lái)他告訴我說(shuō)沒(méi)有用 jQuery,自己手工寫的XMLhttprequest 。他告訴我說(shuō),開(kāi)始是用jquery寫的,而且在測(cè)試過(guò)程中也沒(méi)有出現(xiàn)問(wèn)題。但是在后來(lái)無(wú)意中發(fā)現(xiàn),在頁(yè)面開(kāi)的時(shí)候久了之后,瀏覽器資源竟然占用非常高導(dǎo)致內(nèi)存不足而崩潰了。后來(lái)抓包分析發(fā)現(xiàn),每次jquery的Ajax請(qǐng)求都會(huì)創(chuàng)建一個(gè)xmlHttprequest對(duì)象,理論上講,長(zhǎng)連接的請(qǐng)求是一個(gè)無(wú)限遞歸,請(qǐng)求數(shù)量是非常大的,但是由于每次請(qǐng)求都會(huì)建立一個(gè)新的xmlhttprequest,而且jquery不會(huì)自動(dòng)回收資源,所以導(dǎo)致了內(nèi)存溢出。
通過(guò)查看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.dhdzp.com",
data: { name: "xxxx" },
dataType: "xml",
success: function (data, textStatus) {
//do something...
},
complete: function (XHR, TS) { XHR = null }
});
但是后來(lái)他告訴我說(shuō)沒(méi)有用 jQuery,自己手工寫的XMLhttprequest 。他告訴我說(shuō),開(kāi)始是用jquery寫的,而且在測(cè)試過(guò)程中也沒(méi)有出現(xiàn)問(wèn)題。但是在后來(lái)無(wú)意中發(fā)現(xiàn),在頁(yè)面開(kāi)的時(shí)候久了之后,瀏覽器資源竟然占用非常高導(dǎo)致內(nèi)存不足而崩潰了。后來(lái)抓包分析發(fā)現(xiàn),每次jquery的Ajax請(qǐng)求都會(huì)創(chuàng)建一個(gè)xmlHttprequest對(duì)象,理論上講,長(zhǎng)連接的請(qǐng)求是一個(gè)無(wú)限遞歸,請(qǐng)求數(shù)量是非常大的,但是由于每次請(qǐng)求都會(huì)建立一個(gè)新的xmlhttprequest,而且jquery不會(huì)自動(dòng)回收資源,所以導(dǎo)致了內(nèi)存溢出。
通過(guò)查看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.dhdzp.com",
data: { name: "xxxx" },
dataType: "xml",
success: function (data, textStatus) {
//do something...
},
complete: function (XHR, TS) { XHR = null }
});
您可能感興趣的文章:
- IE下使用jQuery重置iframe地址時(shí)內(nèi)存泄露問(wèn)題解決辦法
- jquery不會(huì)自動(dòng)回收xmlHttpRequest對(duì)象 導(dǎo)致了內(nèi)存溢出
- JQuery1.4+ Ajax IE8 內(nèi)存泄漏問(wèn)題
- JQuery Dialog的內(nèi)存泄露問(wèn)題解決方法
- 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中調(diào)用ajax方法時(shí)在不同瀏覽器中遇到的問(wèn)題
這篇文章主要介紹了jQuery中調(diào)用ajax方法時(shí)在不同瀏覽器中遇到的問(wèn)題,因不同瀏覽器默認(rèn)設(shè)置的不同造成的問(wèn)題2014-06-06
jquery選擇符快速提取web表單數(shù)據(jù)示例
遇到要重復(fù)多次同樣的事時(shí),就想找一種省時(shí)省力的方法,下面就為大家介紹下利用jquery選擇符快速提取web表單數(shù)據(jù)2014-03-03
jQuery HTML css()方法與css類實(shí)例詳解
這篇文章主要介紹了jQuery HTML css()方法與css類,結(jié)合實(shí)例形式詳細(xì)分析了jQuery HTML css()方法與css類相關(guān)函數(shù)用法與操作注意事項(xiàng),需要的朋友可以參考下2020-05-05
jQuery.Validate 使用筆記(jQuery Validation范例 )
學(xué)習(xí)jQuery Validation,于是手寫一公共范例,并收藏以便后用,里面附有測(cè)試代碼,需要的朋友一起來(lái)測(cè)試。2010-06-06
Jquery css函數(shù)用法(判斷標(biāo)簽是否擁有某屬性)
Jquery css函數(shù)用法(判斷標(biāo)簽是否擁有某屬性) ,需要的朋友可以參考下。2011-05-05
JQuery實(shí)現(xiàn)網(wǎng)頁(yè)右側(cè)隨動(dòng)廣告特效
本文給大家分享的是2則使用jquery實(shí)現(xiàn)網(wǎng)頁(yè)右側(cè)隨動(dòng)廣告特效的代碼,非常的簡(jiǎn)單實(shí)用,有需要的小伙伴可以參考下。2016-01-01
jQuery實(shí)現(xiàn)鼠標(biāo)滑向當(dāng)前圖片高亮顯示并且其它圖片變灰的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)鼠標(biāo)滑向當(dāng)前圖片高亮顯示并且其它圖片變灰的方法,涉及jquery鏈?zhǔn)讲僮骷绊?yè)面元素樣式控制的相關(guān)技巧,需要的朋友可以參考下2015-07-07

