Cleaning up javascript before ajax load

[Veeru-4]

Hi there
I have an ajax based page, which loads content from external page (html
+js)

So if i have a div "update_div" being updated with external content
(html+js)
Let me be more specifig

Step1: Ajax content along with js loaded into update_div from a.html

Step2: Ajax content along with js loaded into update_div from b.html

What happens to the js loaded from a.html? Is it lurking in the memory
or automatically/magically removed from the browser memory?
I am afraid of memory leaks, if the js is still lurking in memory, the
more ajax calls made, the more js is going to be held up in memory.

Unless am totally wrong; i have no idea of the mechanism happening
here. Can somebody shed some ligth?

p.s: Hope my post doest go missing this time :)

Thanks
Vru

[waseem sabjee]

well if the js from that page is in the head tag
you can extract everything from in-between the body tags and leave out the js

another way would be to cycle through each element - and do not take across any script tags.

If that js executes it will be held in the memory.

On Tue, Jun 30, 2009 at 10:18 AM, Veeru <swamyveera@...> wrote:

Hi there
I have an ajax based page, which loads content from external page (html
+js)

So if i have a div "update_div" being updated with external content
(html+js)
Let me be more specifig

Step1: Ajax content along with js loaded into update_div from a.html

Step2: Ajax content along with js loaded into update_div from b.html

What happens to the js loaded from a.html? Is it lurking in the memory
or automatically/magically removed from the browser memory?
I am afraid of memory leaks, if the js is still lurking in memory, the
more ajax calls made, the more js is going to be held up in memory.

Unless am totally wrong; i have no idea of the mechanism happening
here. Can somebody shed some ligth?

p.s: Hope my post doest go missing this time :)

Thanks
Vru

[Veeru-4]

In my case, the ajax page, has events and js attached to it -
The events and the js are necessary for the loaded page to display and
behave properly.
Is'nt there a better way to remove the events and js from memory just
before i want to execute another ajax request than to identify each
variable/event and destroy/unbind it?

Thanks
Vru

[Veeru-4]

anybody??

[waseem sabjee]

Been trying to replicate your situation.

the best solution i see is to not load the variables.

may be if you can explain your environment in more detail. like :

this is how I understand.

lets assume we have our container
<div id="container">
within this container we have out element
<div id="target">
we basically loading the full html. css and js from this page into our target element
$.ajax ({
url:b.html,
success : function(html) {
$("#target.").html(""); // ensure the target is empty
$("#target").html(html); // fill target with everything
// if you want only the html within the body tag remove the commenting from the following line
// $(#target").html($("body", html()));
}
});

Now from what i gather b.html as some ajax functions that you want to maintain but there are some functions in there which you do not want.

my solution is

create seperate .js files instead of having script in the b.html page.
so in b.html in the head area you would have something like
<script type="text/javascript" src="js/ajax.js"></script>
try to ensure that all your js files are external and there is no internal js on the page.
instead of loading the whole page - just load items within the body tag and in this ajax call load the appropriate scripts into  your page.
so your ajax function wil be like

$.ajax ({
url:b.html,
success : function(html) {
$("#target.").html(""); // ensure the target is empty
// load script refferences
 $(#target").append('<script type="text/javascript" src="js/ajax.js"></script>');
 $(#target").append($("body", html()));
}
});

On Thu, Jul 2, 2009 at 3:51 AM, Veeru <swamyveera@...> wrote:

anybody??

[Charlie Tomlinson]

there was an interesting thread on this a few months ago. Take a look at the test run, was continuous loading of large file every 200 ms. The OP ran test for a day

Solution Thread:
http://groups.google.com/group/jquery-en/browse_thread/thread/ef024e92a41113a3/58f86e8deca2de4c?lnk=gst&q=memory+leak+ie7#58f86e8deca2de4c

Original Memory Test thread
http://groups.google.com/group/jquery-en/browse_thread/thread/f28ae96a467f84e0/c2d064c1a9ab81bc?lnk=gst&q=memory+leak+ie7#c2d064c1a9ab81bc

Veeru wrote:

Hi there
I have an ajax based page, which loads content from external page (html
+js)

So if i have a div "update_div" being updated with external content
(html+js)
Let me be more specifig

Step1: Ajax content along with js loaded into update_div from a.html

Step2: Ajax content along with js loaded into update_div from b.html

What happens to the js loaded from a.html? Is it lurking in the memory
or automatically/magically removed from the browser memory?
I am afraid of memory leaks, if the js is still lurking in memory, the
more ajax calls made, the more js is going to be held up in memory.

Unless am totally wrong; i have no idea of the mechanism happening
here. Can somebody shed some ligth?

p.s: Hope my post doest go missing this time :)

Thanks
Vru

  

[Veeru-4]

thanks for the reply waseem
i was thinking something along the same lines as well, to keep all the
js in an external file and probably load it even before the ajax pages
are called so there would be no js in the ajax calls, just html.

My web application, is something that usually runs round the clock - i
am not very sure how all these will effect the browser's memory. Too
many ajax calls, with the browser open for long hours; i don't know
how i am supposed to proceed or do things the right way.

What if my js is very huge? will that effect the browsers memory (if
the browser is open for too long).

I just need some information or direction if you can provide me some.

Thanks
Vru

[Veeru-4]

Hi Charlie
I have checked the links you gave me, found some interesting stuff
like adding a .html("") before updating the ajax content; but in the
problem situation mentioned, they were only load html, but what if
there is js as well  - like if any element has an onClick() event in
the html, and this content loads every now and then, does the event
keep binding and binding till it hogs memory?

I can try to remoev all js and include in an external file and load it
before the ajax calls, but i am just afraid the js file might become
too big and get more complicated to handle.

Thanks
Vru

[Charlie Tomlinson]

all the memory issues are over my head, I was hoping someone in the know might provide an interesting answer myself.

I remembered that test , thought it might interest you.

Veeru wrote:

Hi Charlie
I have checked the links you gave me, found some interesting stuff
like adding a .html("") before updating the ajax content; but in the
problem situation mentioned, they were only load html, but what if
there is js as well  - like if any element has an onClick() event in
the html, and this content loads every now and then, does the event
keep binding and binding till it hogs memory?

I can try to remoev all js and include in an external file and load it
before the ajax calls, but i am just afraid the js file might become
too big and get more complicated to handle.

Thanks
Vru

  

[Charlie Tomlinson]

one more thing you might look at and maybe get clarification on

empty()   " Note that this function starting with 1.2.2 will also remove all event handlers and internally cached data.

http://docs.jquery.com/Manipulation/empty

Veeru wrote:

Hi Charlie
I have checked the links you gave me, found some interesting stuff
like adding a .html("") before updating the ajax content; but in the
problem situation mentioned, they were only load html, but what if
there is js as well  - like if any element has an onClick() event in
the html, and this content loads every now and then, does the event
keep binding and binding till it hogs memory?

I can try to remoev all js and include in an external file and load it
before the ajax calls, but i am just afraid the js file might become
too big and get more complicated to handle.

Thanks
Vru

  

[waseem sabjee]

in your ajax all you can have the following :

$.ajax({
url:"b.html",
cache:false, // cache or not
async:true, // load asynchronously or not
success:function(html) {
// code here
}
});

On Thu, Jul 2, 2009 at 6:00 AM, Charlie <charlietfl@...> wrote:

one more thing you might look at and maybe get clarification on

empty()   " Note that this function starting with 1.2.2 will also remove all event handlers and internally cached data.

http://docs.jquery.com/Manipulation/empty

Veeru wrote:

Hi Charlie
I have checked the links you gave me, found some interesting stuff
like adding a .html("") before updating the ajax content; but in the
problem situation mentioned, they were only load html, but what if
there is js as well  - like if any element has an onClick() event in
the html, and this content loads every now and then, does the event
keep binding and binding till it hogs memory?

I can try to remoev all js and include in an external file and load it
before the ajax calls, but i am just afraid the js file might become
too big and get more complicated to handle.

Thanks
Vru

  

[Veeru-4]

Hi there guys
i was thinking of another solution, just watn to get your opinion as
well.

In my javascript, i was thinking of having everything in a name space,
something like this

namespace a=function(){
  setEvents=function(){
  },
 unsetEvents=function(){
 },
 destroy=function(){
 }
}

So everytime an ajax call is made, the namespace is created and before
another ajax call is made,i call the destroy function of this current
namespace to unbind any events.

Does this make sense? I tested with firefox, the memory seems to
pretty ok when i load and destroy the namespace repeatedly.

Any comments?

Thanks
Vru