I'm writing a browser app that would be entirely AJAX-driven (first time in my life), that means:
- it will be one page staying in the browser, loading program components as needed
- browser history will be, well, none.
- page will not be refreshed at all
My concern is what should I do about XMLHttpRequests, since I'm primarily C++ programmer, being taught that when you write a statement like
x = new XMLHttpRequest();
you need to delete
it afterwards.
This question is entirely about memory management, whether this object, allocated with new
stays in memory, even after it finishes it's "cycle" with readyState == 4 or is somehow released, freed, whatchacallit? Honestly, I have no idea at what point could it be freed, since the script creating these will be in HEAD and sit there potentially whole workday. Whether should I:
- create one or several, reused objects of type XMLHttpRequest, program the app so that it won't need any more than this limit,
- or it doesn't matter and I can allocate as many new XMLHttpRequests as I like?
Please include in your answers at what point and WHY those objects would be deleted, if they would at all, considering that the "frame" of my webpage will stay. Hope I made this question clear and thanks for any insightful answers.
EDIT:
Consider code (I removed many lines that were checking for unexpected return values for brevity) of an onClick
event handler, that creates XMLHttpRequest and sends it:
function submitme(){
var p = document.getElementById('p'); //a text field being sent to server
if(typeof p!='undefined' && p!=null){
if(p.value!=""){
//here XMLHttpRequest is created, this function
//returns exactly object of this type or false, when failed
var xhr=createXmlHttpRequestObject();
if(xhr!=false){
xhr.open("POST", "blablabla.php", true);
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if(xhr.status==200){
//result will be posted in this div below
var adiv = document.getElementById('resultdiv');
//extract the XML retrieved from the server
xmlResponse = xhr.responseXML;
//obtain the document element (the root element) of the XML structure
xmlDocumentElement = xmlResponse.documentElement;
//get the response text
if(typeof adiv !='undefined' && adiv != null){
adiv.innerHTML=xmlDocumentElement.childNodes[0].firstChild.nodeValue;
}
}//end xhr.status
}//end xhr.readyState
};//end xhr.onreadystatechange
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(p.value);
}//end xhr!=false
}//end p.value!=""
}//end typeof p!='undefined'
}//end submitme()
When XMLHttpRequest object instance is created, if this handler is fired, it is referenced once by xhr
variable until handler finishes to execute. At this point there are how many references to this object instance? If I understand articles linked in your answers correctly, the answer should be none, and browser just waits for this request to turn readystate==4
, finish executing onreadystatechange
function and object is unreachable? Please confirm.