www.webdeveloper.com
Page 2 of 2 FirstFirst 12
Results 16 to 25 of 25

Thread: bizarre memory leak... can anyone figure it out?

  1. #16
    Join Date
    Nov 2002
    Posts
    36
    Unfortunately using IE I have no plugins installed except flash. I also use drip-05.exe (a windows browser that checks for leaks). I also don't use any plugins on firefox.

  2. #17
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Quote Originally Posted by toicontien View Post
    *** removed my original thoughts because I just realized leak.js only contains a JavaScript comment ***

    @Kor: While the HTML standard says the standard attributes don't apply to SCRIPT elements, you can still specify an Id and use getElementById to grab a reference to that node. That does work in browsers, even though it is technically invalid HTML.
    I know. Sometimes browsers accept illegal syntax. But I thought that, to be sure that the syntax is not the cause of the problem, a standard code should be preferable.

  3. #18
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,755
    Have you monitored memory usage over the period of an hour? Browsers don't immediately reclaim memory used by JavaScript. It's actually perfectly natural to see memory usage go, then back down again. How long have you monitored the browser?

  4. #19
    Join Date
    Mar 2009
    Posts
    430
    This is very interesting. I played around with it and learned some things. Basically, you are trying to kill or replace the function by altering the HTML tags that defined it. This doesn't work, unless you change the src property to something different (I think) Look at this code and play with the buttons and you will see what I mean. The javascript functions defined within the script tags persist even when the code in the script tags which defined them are purged from the document.

    Code:
    <html>
    	<head>
    
    		<title>Untitled Document</title>
    <script type="text/javascript">
    function killer(){  // this destroys the script tags with the id of "dead"
      var q = document.getElementsByTagName('script');
      alert("There are: " + q.length + " script tag(s) in this document");
      var x = document.getElementById("dead");
      if(x == (null || undefined)){
           alert("I DIDN'T FIND ANY ELEMENT WITH THAT ID--THE TAG IS GONE FROM THE DOCUMENT");
           return;
       }
       x.parentNode.removeChild(x);
       // you would think the "dead" function was gone---it isn't
    }
    
    </script>
    <script type="text/javascript" id="dead">
    function dead(){alert("I AM COMING FROM THE FUNCTION YOU ARE TRYING TO KILL");}
    </script>
    
    
    	
    	</head>
    	<body>
    <input type="button" onclick="dead()" value = "Fire function that you trying to kill"/><br />
    <input type="button" onclick = "killer()" value="Try to kill that function" /><br />
    <p>Make sure to click on the last button at least twice.  The second time it will indicate that there is only one script element in the document.  The first time it indicates there are two.  But the function that was defined by the eliminated script tags does not die.</p>
    	</body>
    </html>

  5. #20
    Join Date
    Dec 2010
    Posts
    207
    Quote Originally Posted by Tcobb View Post
    This is very interesting. I played around with it and learned some things. Basically, you are trying to kill or replace the function by altering the HTML tags that defined it.
    The .js file being imported consisted only of a comment line, although it's possible that there's a text node being added that isn't removed. Perhaps it would show under FireBug's HTML tab.


    Q: I found this code...
    A: Then find its author.

  6. #21
    Join Date
    Mar 2009
    Posts
    430
    My understanding is that comments do indeed take up space in javascript, and that is one reason why they should be removed for the actual workhorse code. What I also find interesting is that the javascript here is enclosed within a SPAN tag. It might be interesting to see the number of childnodes it has as the setInterval progresses.

  7. #22
    Join Date
    Nov 2002
    Posts
    36
    Quote Originally Posted by Tcobb View Post
    My understanding is that comments do indeed take up space in javascript, and that is one reason why they should be removed for the actual workhorse code. What I also find interesting is that the javascript here is enclosed within a SPAN tag. It might be interesting to see the number of childnodes it has as the setInterval progresses.

    tcobb, since javascript is reference memory based, I think the button is holding a reference to the function. Just a guess. If you set the button onclick method to null in killer, it should help. I may try it to see.

    In my case, I am adding a purely dynamic entity that does not take up space in the original HTML, and am trying then to remove it.

    I find this all very curious.

  8. #23
    Join Date
    Mar 2009
    Posts
    430
    I think the route you're going now is the way to go. That's the way I would have gone, but I thought the approach you took was very fascinating. I know I didn't help you, but by trying to deal with your problem it did help me with my understanding of Javascript, for which I thank you. And just for cheap thrills, you might be interested in this as regards to dynamically created scripts:

    Code:
    <html>
    	<head>
    
    		<title>Untitled Document</title>
    <script type="text/javascript">
    window.onload= function(){
       setTimeout(doIt, 2000);
    }
    
    function doIt(){
      var x = document.getElementById("s1");  // target the element to which the script tag is a child node
      x.parentNode.removeChild(x);  //now kill it and its child the SCRIPT  tag
      x = null;  //now drive a stake in its heart
      var str = 'setTimeout(zap, 5000)';  // the setTimeout process does not exist yet so there is no reference to bind to
      // its just a string
      eval(str);  //now the setTimeout process DOES exist, coming into existence after what it is supposed to bind to has been officially killed
    }
    
    </script>
    
    
    	
    	</head>
    	<body>
    
    <span id = "s1">Here is the span with script within it. I'll be dead in two seconds.
    <script type="text/javascript">
    function zap(){alert("HERE--I'M GENERATED BY THE SCRIPT THAT'S SUPPOSED TO BE DEAD.");}
    </script>
    </span>
    <p>The moral of the story, so far as I can see it, is that javascript code that is set by the code between script tags cannot be killed by deleting the script tags that put it into existence.  It will still be there. The alert box of the function
    that is supposed to have been destroyed will pop up soon.</p>
    	</body>
    </html>
    That is what I really like about such forums as this. By trying to solve other people's problems we can all learn a lot. I'm sorry I couldn't help you with yours but trying to help you solve yours did teach me a lot.

    --Thanks

  9. #24
    Join Date
    Jan 2011
    Posts
    117
    Quote Originally Posted by Doug_Dyer View Post
    The leak is classic: introduce a dynamic script DOM element, let the script execute, then remove the DOM node. Rinse. Repeat. The problem is the DOM element will not free and I cannot see any circular reference. I've tried all the tricks and can't solve it. The leak exists in both ie 6-8 and firefox.

    My kit does real time updates without requiring a page reload/refresh so the leak is bothersome and can grow quickly.

    I have tried moving the node to a garbage pool DIV and setting the innerHTML to "". I have tried the destroy() approach. I have stood on my head and walked with my ears.

    All you need are these two small files:

    File 1 leak.js:
    // all the file contains is this one comment line!

    File 2 leak.html:
    Code:
    <html>
    <SPAN id='leakid'><SCRIPT language='JavaScript'>
    
    // CALLED EVERY 500 ms FROM TIMER
    function getUpdate() {
        var mySpan = document.getElementById('leakid');
    
        // WHACK THE OLD ONE FROM LAST GO AROUND
        var oldNode = document.getElementById('myUpdater');
        if (oldNode) {
            oldNode.parentNode.removeChild(oldNode);
            oldNode = null;
        } 
        
        // LOAD A NEW ONE
        var newNode = document.createElement('script');
        newNode.type = 'text/javascript';
        newNode.src = 'leak.js';
        newNode.id = 'myUpdater';
        mySpan.appendChild(newNode);
        newNode = null;
        mySpan = null;
        return;
    }
    
    </SCRIPT></SPAN>
    <BODY bgcolor="#4682B4" leftmargin="2" marginheight="0" marginwidth="0" topmargin="2" onload="getUpdate(); timerInterval = setInterval('getUpdate()', 500);">
    </BODY></HTML>
    bizarre html structure!
    what were you thinking?

  10. #25
    Join Date
    Mar 2011
    Posts
    1

    Have you tried this?

    I was looking for a solution to the same problem. I read this thread and others, and I believe I found a solution here:

    http://ajaxian.com/archives/dynamic-...d-memory-leaks

    I hope it doesn't come too late for you.

    P.S. I haven't tested this solution yet, but it makes some kind of sense... Good luck!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles