《网四元素内存机制教材课程》由会员分享,可在线阅读,更多相关《网四元素内存机制教材课程(7页珍藏版)》请在金锄头文库上搜索。
1、网页核心四元素内存机制,陈鑫 ,网页核心四元素,Dom,CSS,JavaScript,Images,Dom节点的回收,Dom,window.recycler=(function() var t=document.createElement(div);t.id=“r; return t; )(); function _removeElement(el) el= document.createElement(el); if (el ,置入未进入Dom树的节点中,则可回收内存 而关于交叉引用的内存泄漏,我们书写规范即可,/jQuery目前的方式,存在bug function _removeNode(
2、el) el=document.createElement (el); if (!el)return; if (el.removeNode) el.removeNode(true); else if (el.parentNode) el.parentNode.removeChild(el); ,图片元素的内存占用及回收,Images,尺寸:950*240 大小:30.3K,950*240*3,684000/1024=667K,图片在网页中的内存计算公式:长*宽*(34),别担心,浏览器大多是可以回收的,JavaScript脚本的内存回收,动态语言,内存占用不定,JavaScript,funct
3、ion getScript(url) var script = document.createElement(script); script.async = true; script.src = url; document.body.appendChild(script); return script; /目前最好的解决方案,但仍然不能完全释放 setTimeout(function() for(var p in script) delete scriptp; document.body.removeChild(script); , 100);,网页核心四元素内存机制,结语,通过上述的分析,我
4、们可以得到下面的结论: 网页中的节点,图片(CSS背景图片)我们都可以找到内存完美回收的办法 而对于外部引用的CSS文件和JS脚本 在CSS方面,可以在移除节点前调用deleteRule方法来删除里面的每个样式,然后再移除整个CSS节点,能够部分回收。 在JavaScript方面,外部节点移除前用delete方式移除部分自有属性,能够部分回收内存。,参考: http:/www.quirksmode.org/dom/w3c_css.html W3C DOM Compatibility - CSS http:/neil.fraser.name/news/2009/07/27/ JSONP Memory Leak(software engineer atGooglein California),