关于Iframe的内存的泄漏问题

工作日志
      在这里插入代码片上个星期终于把手头的工作忙完了,内网通过三次nginx反向代理终于可以把所有资源全部访问到了,包括阿里云服务器当中的资源。
      不到上线,你永远不知道有多少坑,以为一切都正常了的时候,我开始了性能测试,前端测试的时候,发现iframe概率加载失败,作为一个认为一定是什么原因导致的,打开内存查看工具,占用内存168MB,电脑是8GB的,分配给IE浏览器的内存有2GB,足够用了。
      但是出现一个问题,我发现点的次数多了,iframe会加载失败,果断进行内存日志,发现随着点击次数的增加,iframe的内存并没有被回收,也就是说,虽然iframe的页面进行了切换,但是上一个iframe加载页面内容的内存并没有被回收,随着点击次数的增加,iframe泄漏的内存达到一定内存,IE没有足够的内存进行渲染页面,继续点击,IE就会进入假死状态,如果继续点击,内存溢出,IE浏览器会直接崩溃,既然知道了原因,那就可以着手进行解决了。
      首先翻看了IE官方的英文资料,上面是这么描述的,首先将要iframe的src置为空字符串,src="",然后调用frame.contentWindow.document.write(’’);//清空iframe的内容
frame.contentWindow.close();//避免iframe内存泄漏
frame.remove();//删除iframe
CollectGarbage();//这个方法为IE下独有,做内存释放之用
就可以进行内存回收了,暗自感叹,不愧是官方的说法,果然奏效了,就在我高兴的时候,天真的我,继续进行了内存测试,内存的增长速度确实下降了。但是,加速度大于0,速度永远在增长呀,也就是说,内存泄漏依然存在。
      后来我发现,内存虽然回收了,可是只是回收了一部分,也就是,回收的代码没有执行完,系统已经进行的刷新页面,或者切换页面的操作了,经过研究,src="about:blank"效果会好非常多,内存增长的速度变的更慢了,但是依旧在增长!!!
      最后的最后,使出了大招,在src="about:blank"后,调用settimeout函数延迟0.1秒调用以下代码,
frame.contentWindow.document.write(’’);//清空iframe的内容
frame.contentWindow.close();//避免iframe内存泄漏
frame.remove();//删除iframe
CollectGarbage();//这个方法为IE下独有,做内存释放之用
问题终于得到解决,内存终于趋于稳定。
心情不是 很好,博客更新的不是很及时,望请见谅,下一次更新,nginx实现高可用以及多台nginx的联合实现,以及nginx中使用扩展模块。

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
确保在使用 `iframe` 时,需要注意以下几点,可以减少内存泄漏的风险: 1. 及时销毁 `iframe`:在使用 `iframe` 的场景中,需要及时销毁 `iframe`,否则可能会导致内存泄漏。可以在 `iframe` 加载完成后手动销毁它,或者在不需要时将其 `src` 属性设置为空字符串,然后再从 DOM 中删除它。 2. 避免在 `iframe` 中使用全局变量:由于 `iframe` 和父页面是两个独立的 JavaScript 执行环境,因此在 `iframe` 中定义的全局变量不会被父页面所感知,而在父页面中定义的全局变量也无法在 `iframe` 中直接使用。为了避免这样的问题,可以使用 `window.parent` 或 `window.top` 等方法来获取父页面的全局变量。 3. 使用 `sandbox` 属性:在使用 `iframe` 的场景中,可以使用 `sandbox` 属性来限制 `iframe` 的行为和访问权限,从而避免 `iframe` 中的恶意代码对父页面造成威胁。例如,可以使用 `sandbox="allow-scripts"` 来限制 `iframe` 中的脚本仅能访问自身的内容,不能访问父页面的内容。 4. 使用 `postMessage` 方法:在 `iframe` 和父页面之间通信时,应该使用 `postMessage` 方法来传递数据,避免直接共享数据或使用全局变量。这样可以避免因为数据共享不当而导致内存泄漏问题。 总之,在使用 `iframe` 时,需要注意释放资源和安全问题,遵循最佳实践可以减少内存泄漏和安全问题的风险。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值