Best Practices for High Frequency AJAX Polling

[esdot]

Hi all,

I've created an application that polls for new information for a variable rate - usually between 2 and 10 seconds (near real-time). A problem that I've incurred is there is a memory leak in my application which brings me to my question: what is the most efficient way to poll for new information? I also want the polling to be variable, that is, when the application loads the polling can be set to any number of seconds. The following are code snippets from my current implementation that consists of a

Ext.data.Connection object invoking the request object periodically using a the Ext.TaskMgr.
Below is code from a class I call SC2.View - the constructor for the class creates a single Ext.data.Connection object. The constructor also creates a "task" object for each "data feed". A data feed is really just a JSON web service that can be accessed as frequently as once per second.

		 this.conn = new Ext.data.Connection();
				this.feeds[i].pollTask = {
						view:this,
						pollId:i,
						run: function(){    						        	
				        	this.view.pollFeed(this.pollId);    	        					        	     		
						},
						interval: this.feeds[i].pollingFrequency*1000 //JavaScript uses milliseconds 	    				
		 		};

These task objects would be invoked using the Ext.TaskMgr using a method called

		startAllPollTasks : function(feedId){	        		
    		for(var j in this.feeds){
    			Ext.TaskMgr.start(this.feeds[j].pollTask);    	        	
    		}    		 			    	    		    				
		},

the SC2.View.pollFeed method invokes the request method of the SC2.View.conn Ext.data.Connection object

		pollFeed : function(feedId){
			var url = this.feeds[feedId].url;
			this.conn.request({				
			    url:url,
			    feedId: feedId,
			    method:'GET',
			    scope:this,
			    callback: this.pollFeedCallback
			});									
			return true;
		},


this.feeds[i].pollTask = {
						view:this,
						pollId:i,
						run: function(){    						        	
				        	this.view.pollFeed(this.pollId);    	        					        	     		
						},
						interval: this.feeds[i].pollingFrequency*1000 //JavaScript uses milliseconds 	    				
		 		};

I'm sorry the class I've written is very large, I am just focusing on the components related to the server interaction that are contributing to my memory leak. I can also post a barebones working example if that helps anyone understand the problem. Essentially I'm looking for a more memory efficient solution than using the Ext.TaskMgr and an Ext.data.Connection object to poll one to many JSON web services very frequently.

Thanks for any help, EXT JS is an amazing framework with amazing community based support!

[hendricd]

@esdot --
I would recommend against using Ext.TaskMgr for XHR polling.

Using it would not account for the inherit latency of request responses (especially at 1 second intervals). It would quickly consume the limited number of concurrent connections the browser will permit (2-4) rendering the remainder of your solution (Grids, treeLoaders, etc) waiting in line for a chance to do their thing.

Have a look at the ext-basex adapter extension. It adds request queuing (keeps the browsers' max sockets in mind for all Ajax requests), integrated JSONP support, and multipart response handling.

With all that in mind (and depending on your needs), your next request should not be attempted/queued until the previous has returned (accounts for latency -- keeping the browser operating smoothly) as in pseudo:

makeRequest ({asynch: true, queue : {priority : 9} ) {
  do processParts()
  do makeRequest.defer(2000)
}

[steffenk]

there is also an example for longpoll. In this case the delay is server side:
http://extjs.com/forum/showthread.php?t=66788