easy-ui控件加载Tab导致内存溢出 -

1986101021

浏览: 7049 次
性别:
来自: 南京

最近访客更多访客>>

jtggjy

sdvjbc

mhm52368

小小菜菜阿斯达

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

easy-ui控件加载Tab导致内存溢出

博客分类：

easy tab ui

    今天测试部提了个故障，我负责的模块使用 easy-ui 控件的 tab 方式实现的，会出现内存溢出，在 IE6 上尤为明显。当一次加载大量 tab 的时候，连续刷新，浏览器会很快崩溃。后来查了些资料，发现很少有这方面的解决方案，我这里今天总结了一下。

    首先，我这边的 tab 是两层 Tab，为了解决 select 组件在 IE6 上会被覆盖的 Bug，采用了 $("#id").html("<iframe ............/>");的方式实现，（中间懒得写，打架应该都明白的呵呵），iframe是为了显示 tab 页的内容。在关闭或者刷新整个 Tab 的时候，iframe 所占用的内存并不能完全释放，当操作的 Tab 越多，内存占用越大，随时可能导致浏览器崩溃。现在给出一个有效的解决方法。

    1、在jquery.tabs.js 中查找 panel("options").tab.remove();(需要根据 easyui 的版本来确定此段代码所在的 js 文件，可以借助 eclipse 的 search 功能查找)。在此段代码后，添加如下代码片段：
      var frame = $('iframe',tab);
      if(frame.length>0){
          frame[0].contentWindow.document.write('');
          frame[0].contentWindow.close();
          frame.remove();
          if($browser.msize){
              CollectGarbage();
          }
      }
    2、此时可以使用 Sieve 进行测试，工具可以到下面的网站下载。
       http://home.wanadoo.nl/jsrosman/
    3、如果上述方式已经修改还是会存在内存溢出的情况，说明 iframe 还是没有完全释放，此时，可以在加载 Tab 的 jsp 文件中，添加如下函数

      function reClearIframe(id){
          var el= $("#id");
          var frame = el.contentWindow;
          if(el){
              el.src='abort:blank';
              try{
                  iframe.document.write('');
                  iframe.documnet.clear();
                  iframe.remove();
               }catch(e){}
               document.body.removeChild;
          }
      }
然后再次jsp页面的 body 属性中添加 onunload属性。如：<body onunload="clearIframe">
并在函数中实现：
      function clearIframe(){
          reClearIframe(iframe1);
          reClearIframe(iframe2);
          reClearIframe(iframe3);
          ........
      }
其中 iframe1、iframe2、 iframe3 为加载 Tab 页的 ifarme 的id。

以上第一和第三步任一一种实现方式单独都可以有效的解决加载 Tab 内存溢出的情况，但是。有时，会受到其他引入的 js 的影响。也可以两个都用，但是会，给人觉得有重复释放 iframe 的感觉。呵呵...本来 iframe 在 IE6 就存在很多 Bug 。
    最后，希望能对大家有帮助吧。期待高手们有更好的解决方法，如果有，可以发送到我邮箱 liuyang101021@163.com 谢谢

分享到：