最近參與一個項目的開發,由於項目是基於瀏覽器的胖用戶端(RIA)應用程式,頁面中大量調用iframe。後期測試發現瀏覽器記憶體一直居高不下,而且開啟iframe頁面越多記憶體佔用越大,在IE系列瀏覽器中尤其明顯。所有開啟的iframe頁面即使關閉了,記憶體使用量也沒有明顯的下降,IE瀏覽器在記憶體佔用達到400M左右就變得很卡。分析發現是iframe沒有釋放造成的,於是對所有已關閉的iframe所佔用的記憶體進行釋放,雖然不能完全釋放,但是iframe記憶體佔用量不會一直增長,整個應用記憶體使用量量控制在150M左右。
/** * 動態建立iframe * @param dom 建立iframe的容器,即在dom中建立iframe。dom可以是div、span或者其他標籤。 * @param src iframe中開啟的網頁路徑 * @param onload iframe載入完後觸發該事件,可以為空白 * @return 返回建立的iframe對象*/function createIframe(dom, src, onload){//在document中建立iframevar iframe = document.createElement("iframe");//設定iframe的樣式iframe.style.width = '100%';iframe.style.height = '100%';iframe.style.margin = '0';iframe.style.padding = '0';iframe.style.overflow = 'hidden';iframe.style.border = 'none';//綁定iframe的onload事件if(onload && Object.prototype.toString.call(onload) === '[object Function]'){if(iframe.attachEvent){iframe.attachEvent('onload', onload);}else if(iframe.addEventListener){iframe.addEventListener('load', onload);}else{iframe.onload = onload;}}iframe.src = src;//把iframe載入到dom下面dom.appendChild(iframe);return iframe;}/** * 銷毀iframe,釋放iframe所佔用的記憶體。 * @param iframe 需要銷毀的iframe對象*/function destroyIframe(iframe){//把iframe指向空白頁面,這樣可以釋放大部分記憶體。iframe.src = 'about:blank';try{iframe.contentWindow.document.write('');iframe.contentWindow.document.clear();}catch(e){}//把iframe從頁面移除iframe.parentNode.removeChild(iframe);}