Page 1 of 3 123 LastLast
Results 1 to 10 of 24

Thread: High memory consumption in IE9 iframe

    Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Apr 2007
    Posts
    164
    Vote Rating
    0
      0  

    Default High memory consumption in IE9 iframe

    REQUIRED INFORMATION


    Ext version tested:
    • Ext 4.1.1


    Browser versions tested against:
    • IE9


    DOCTYPE tested against:
    • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


    Description:
    • If use ExtJS 4.1.1 in the iframe under IE9 (tested in MS VISTA) then after few iframe refreshed the memory consumption is very high


    Steps to reproduce the problem:


    The result that was expected:
    • Low memory consumption


    The result that occurs instead:
    • For me, memory consumption is 714 MB for iexplorer.exe process (in Windows TaskManager)



    HELPFUL INFORMATION

    See this URL for live test case: http://docs.sencha.com/ext-js/4-1/#!...arts/Area.html


    Debugging already done:
    • none


    Possible fix:
    • not provided


    Additional CSS used:
    • only default ext-all.css
    • custom css (include details)


    Operating System:
    • MS VISTA SP2

  2. #2
    Sencha User
    Join Date
    Apr 2007
    Posts
    164
    Vote Rating
    0
      0  

    Default

    The problem is reproducible in Chrome v21 also
    For example,
    1. Open http://docs.sencha.com/ext-js/4-1/#!/example ( memory in TaskManager 110 MB )
    2. Open all samples from Chart group ( memory 308 MB )
    3. Close All samples tabs
    4. Memory is not decreased
    5. Open all samples from Grid group ( memory 558 MB )
    6. Close all samples Tab
    7. Memory is not decreased ( still 558 MB )

  3. #3
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,556
    Vote Rating
    1272
      0  
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  4. #4
    Sencha User
    Join Date
    Apr 2007
    Posts
    164
    Vote Rating
    0
      0  

    Default

    May be but the problem occurs in Chrome also. Under FF situation is better bot not good also
    The issue occurs only if an iframe with extjs is used in a page

  5. #5
    Sencha User
    Join Date
    Apr 2007
    Posts
    164
    Vote Rating
    0
      0  

    Default

    is it really ExtJS memory leaking (if extjs in iframe page then brwser doesn't release a memory after iframe destroying)? Or the issue is not related with ExtJS?
    Just such issue is not observed with ExtJS 3.x

  6. #6
    Sencha User Daniil's Avatar
    Join Date
    Jun 2010
    Location
    Saint-Petersburg, Russia
    Posts
    1,017
    Vote Rating
    125
      0  

    Default

    Hi Mitchell,

    Please clarify is there any update on this issue?

  7. #7
    Sencha User
    Join Date
    Apr 2007
    Posts
    164
    Vote Rating
    0
      0  

    Default

    Bump
    Can you somebody to clarify whether it will be considered as a bug? If yes then could we expect any memory improvements in 4.2?
    Thanks in advance for any info

  8. #8
    Sencha User Daniil's Avatar
    Join Date
    Jun 2010
    Location
    Saint-Petersburg, Russia
    Posts
    1,017
    Vote Rating
    125
      0  

    Default

    Could someone provide any info on this issue, please?

  9. #9
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    18,600
    Vote Rating
    874
      0  

    Default

    It's not quite as straight forward.

    outer.html
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Outer</title>
        <script type="text/javascript">
            setInterval(function(){
                document.getElementById('frame').contentWindow.location.reload(true);
            }, 1000);
        </script>
    </head>
    <body>
        <iframe id="frame" style="width: 600px; height: 600px;" src="inner.html"></iframe>
    </body>
    </html>
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Test</title>
        <script type="text/javascript" src="../extjs-4.1.2/ext-all.js"></script>
        <script type="text/javascript">
            setTimeout(function(){
                document.body.innerHTML = new Date().toString();
            }, 500);
        </script>
    </head>
    <body>
    </body>
    </html>
    When I look at the memory consumption, it jumps all over the place, but on my machine (IE9, Win7) it always ends up around 109MB as a settling point. The memory does increase slightly over time, however I see the same kind of behaviour with jquery. Obviously the jumps in memory are less severe because the library is smaller, but it's the same thing on a smaller scale.

    The problem is more likely in the application code, since the same thing should be reproducible with just loading the library.
    Evan Trimboli
    Twitter - @evantrimboli

  10. #10
    Sencha User
    Join Date
    Oct 2012
    Posts
    1
    Vote Rating
    0
      0  

    Default

    Quote Originally Posted by evant View Post
    It's not quite as straight forward.<br>
    <br>
    outer.html<br>
    Code:
    <br>
    &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;<br>
    &lt;html&gt;<br>
    &lt;head&gt;<br>
    &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;<br>
    &nbsp;&nbsp; &nbsp;&lt;title&gt;Outer&lt;/title&gt;<br>
    &nbsp;&nbsp; &nbsp;&lt;script type="text/javascript"&gt;<br>
    &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;setInterval(function(){<br>
    &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;document.getElementById('frame').contentWindow.location.reload(true);<br>
    &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;}, 1000);<br>
    &nbsp;&nbsp; &nbsp;&lt;/script&gt;<br>
    &lt;/head&gt;<br>
    &lt;body&gt;<br>
    &nbsp;&nbsp; &nbsp;&lt;iframe id="frame" style="width: 600px; height: 600px;" src="inner.html"&gt;&lt;/iframe&gt;<br>
    &lt;/body&gt;<br>
    &lt;/html&gt;<br>
    <br>
    <br>
    Code:
    <br>
    &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;<br>
    &lt;html&gt;<br>
    &lt;head&gt;<br>
    &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;<br>
    &nbsp;&nbsp; &nbsp;&lt;title&gt;Test&lt;/title&gt;<br>
    &nbsp;&nbsp; &nbsp;&lt;script type="text/javascript" src="../extjs-4.1.2/ext-all.js"&gt;&lt;/script&gt;<br>
    &nbsp;&nbsp; &nbsp;&lt;script type="text/javascript"&gt;<br>
    &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;setTimeout(function(){<br>
    &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;document.body.innerHTML = new Date().toString();<br>
    &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;}, 500);<br>
    &nbsp;&nbsp; &nbsp;&lt;/script&gt;<br>
    &lt;/head&gt;<br>
    &lt;body&gt;<br>
    &lt;/body&gt;<br>
    &lt;/html&gt;<br>
    <br>
    <br>
    When I look at the memory consumption, it jumps all over the place, but on my machine (IE9, Win7) it always ends up around 109MB as a settling point. The memory does increase slightly over time, however I see the same kind of behaviour with jquery. Obviously the jumps in memory are less severe because the library is smaller, but it's the same thing on a smaller scale.<br>
    <br>
    The problem is more likely in the application code, since the same thing should be reproducible with just loading the library.
    <br><br>I've made an example because we are also having problems with memory usage relating to adding and removing Iframes from urls, if you run the example without the ext-js file linked and watch the memory usage while clicking add and remove it'll settle to roughly around what it starts at, maybe 1 or 2k difference which I've always seen drop down to what it starts at after enough time.<br><br>Now if you put the ext-js file reference back and do the same the memory usage goes insane!! i had it up to 200mb+ in a few seconds, this is clearly a leak somewhere in a framework, if Jquery had such a leak the memory usage wouldn't go down but with ext it just keeps going up! is it perhaps because both the child and parent have the ext framework so the child frame interacts with the parent which doesn't get cleaned up on unload of the iframe? If so this is a big problem for us as we use a heavy tab system and once you start using ext controls the memory usage becomes even worse, I had crome at 2gb+ on the sencha examples alone!!<br><br>Are you sure there is nothing that can be done since this is almost a game breaker for us (we are using Ext.Net but the example shows its clearly a JS problem)<br><br>Example:<br>Main page<br>
    Code:
    &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;<br>&lt;html&gt;<br>&lt;head&gt;<br>&lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;<br>&nbsp;&nbsp;&nbsp; &lt;title&gt;Outer&lt;/title&gt;<br>&nbsp;&nbsp; &nbsp;&lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"&gt;&lt;/script&gt;<br>&nbsp;&nbsp; &nbsp;&lt;script type="text/javascript" src="ext-all.js"&gt;&lt;/script&gt;<br>&nbsp;&nbsp;&nbsp; &lt;script type="text/javascript"&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(function() {<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;$("#add").click(function() {<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;if($("#iframe").length == 1) return;<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;$("#frame").append('&lt;iframe id="iframe" style="width: 600px; height: 600px;" src="iframe.html"&gt;&lt;/iframe&gt;');<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;});<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;$("#remove").click(function() {<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;$("#iframe").remove();<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;});<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;});<br>&nbsp;&nbsp;&nbsp; &lt;/script&gt;<br>&lt;/head&gt;<br>&lt;body&gt;<br>&nbsp;&nbsp;&nbsp; &lt;a href="#" id="add"&gt;Add&lt;/a&gt;<br>&nbsp;&nbsp; &nbsp;&lt;a href="#" id="remove"&gt;Remove&lt;/a&gt;<br>&nbsp;&nbsp; &nbsp;&lt;div id="frame"&gt;<br>&nbsp;&nbsp; &nbsp;<br>&nbsp;&nbsp; &nbsp;&lt;/div&gt;<br>&lt;/body&gt;<br>&lt;/html&gt;
    <br><br>Iframe:<br>
    Code:
    &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;<br>&lt;html&gt;<br>&lt;head&gt;<br>&lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;<br>&nbsp;&nbsp;&nbsp; &lt;title&gt;Outer&lt;/title&gt;<br>&nbsp;&nbsp; &nbsp;&lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"&gt;&lt;/script&gt;<br>&nbsp;&nbsp; &nbsp;&lt;script type="text/javascript" src="ext-all.js"&gt;&lt;/script&gt;<br>&lt;/head&gt;<br>&lt;body&gt;<br>&nbsp;&nbsp;&nbsp; Added<br>&lt;/body&gt;<br>&lt;/html&gt;
    <br><br>Julian

Page 1 of 3 123 LastLast

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •