Dynamic Iframe (inside ModalPopUpControl ) Memory Leak In Internet Explorer

[cdmsenthil]

I have an Infragistics UltrawebGrid [hierarchical grid with 3 levels]. Each Row in the grid is attached to a context menu using Infragistics CSOM [Client Side Object Model]

Upon click on the menu, I am creating an Iframe dynamically which points to another page in the same domain [same web application] which also contains infragistics datagid [non hierarchical] populated with default data retrieved from Data Base. After creating the frame I am attaching it to the HTML DOM [Div Layer] and show it as modal popup with OK and Cancel Button inside an ModalPopUpControl Extender. Upon click on any of the buttons, I am destroying the Iframe from DOM. I am calling ModalPopUpControl show() and hide() methods for displaying and canceling modal popup.

Following are the functions I am using for Iframe Creation and Destroy.

 
    //----------------------------------------------------------------------------------------------------
 
    // oSrcCtrl – Parent Control where dynamic iframe to be attached (DIV)
    // strFraId - Iframe Identifier
    //-----------------------------------------------------------------------------------------------------
 
    function CreateIFrame(oSrcCtrl,strFraId) {
 
        var iframe = document.createElement("iframe");
 
       iframe.setAttribute("id", strFraId);
 
       iframe.setAttribute("scrolling", "no");
 
       iframe.setAttribute("frameBorder", "0");   
 
       oSrcCtrl.appendChild(iframe);
 
   }
 
   //--------------------------------------------------------------------------------------------------------
 
   // oSrcCtrl – Parent Control where dynamic iframe to be attached (DIV)
   // strFraId - Iframe Identifier
   //---------------------------------------------------------------------------------------------------------
   function DestroyIframeById(oSrcCtrl, strFraId)
   {    
 
       if (document.all)
 
       {       
 
           document.getElementById(strFraId).src = 'javascript:false';
 
           document.all[strFraId].outerHTML = '';
 
              }else{
 
           oSrcCtrl.removeChild(document.getElementById(strFraId));
 
       }  
 
   }

Repeatedly clicking on the menu [for iframe creation] & OK, Cancel button [for destroying iframe] causing huge performance bottleneck. The amount of memory used by the IE keeps on increasing for each clicks I.e. [Dynamic Creation of iframe and Removing the same after button click] but while unloading the page i.e. navigating to a different page the IE memory usage comes to normal.

I would need your help to validate my JavaScript codes for Iframe creation and Remove. Also request you guys to suggest some alternate solutions to get away this memory leak.

I Just downloaded Javascript Memory leak detector from http://blogs.msdn.com/gpde/pages/jav...-detector.aspx and yet to profile my code, once i am done with that I'll update this post with my results and in the mean time i would appreciate any help. Showing and Hiding ModalPopUpControl using javascript code (behaviour.show() & behaviour.hide()) will casue any memory leak?


Note:

1. The response time to load the iframe is not an issue; it loads with in the expected time

2. For each Iframe request the response size is nearly 500KB [includes data retrieved from database + infragistics JavaScript resource files]

[acoder]

Instead of continuously creating and destroying iframes, reuse the same one(s).

If you must, consider a timeout too to allow the frame to be removed.

Another tool for detecting leaks is Drip.