How to implement super fast ASP.NET AJAX callbacks/PageMethods

1.8k views Asked by At

I am designing an ASP.NET web application (.NET 4.0) which basically has a page that should interact with the code behind every 1-2 seconds (Using Client callbacks or PageMethods via ScriptManager or jQuery.ajax) It'll be hosted on an intranet, so a 1-2 second refresh rate is kind of reasonable.

  1. How can I make the page to access the web service/pagemthod in the code behind in a timeply manner (e.g. every 1 second). Should I use a javascript timer (I'm not familiar with javascrip very much)?

  2. Although the site is hosted on an intranet, but I still need to implement a good approach to reach the desired refresh rate. the amount of data being transfered is about 1KB in each interaction. What are your recommendations on my design regarding this? (using callbacks or ScriptManager or jQuery.ajax,... any pitfalls I should avoid)

Thanks.

3

There are 3 answers

2
Dave Ward On BEST ANSWER

A 1kb request every 1-2 seconds is reasonable using either approach. A page method or web service (they're nearly identical under the hood) that does nothing will respond in just a few milliseconds if you're dealing with a fast network/server.

The limiting factor will be how long the meat of your server-side method takes to complete (i.e. if it's involves a database or external service, that's going to slow you down more than the overhead of the service).

1
Luke On

I use Webservices, since they are much faster. But if you doing with UpdatePanels, Webservices are useless. Futher I would say, you shouldnt update the page every x seconds, but first ask, if there is an update to do at all. This saves a lot ;-)

This might be a little example, i didn´t try but worked once like this. Is a ms ajax version, needs scriptmanager

Type.registerNamespace("myproject");

myproject.updateControl = function () {
    myproject.updateControl.initializeBase(this);
    this._xhr = null;
    this._updating = false;
    this._timer = null;
}

myproject.updateControl.prototype = {
    initialize: function () {
        myproject.updateControl.callBaseMethod(this, 'initialize');
        this.startTimer();
    },
    startTimer: function () {
        if (this._timer) clearTimeout(this._timer);
        this._timer = setInterval(Function.createDelegate(this, this._timerWork), 2000);
    },
    stopTimer: function () {
        clearTimeout(this._timer);
        this._timer = null;
    },
    _timerWork: function () {
        if (this._updating || !this._checkXhr()) return;
        this._xhr = Sys.Net.WebServiceProxy.invoke("myServicePath Or null if PageMethod", "checkForUpdate",
         false,
         null,
         Function.createDelegate(this, this._onCheckedUpdate));

    },
    _onCheckedUpdate: function (data) {
        this._xhr = null;
        if (data.needsUpdate) {
            this._update();
        }
    },
    _udpate: function () {
        if (!this._checkXhr) return;
        this._updating = true;
        this._xhr = Sys.Net.WebServiceProxy.invoke("servicepath", "updateMe", false, { param: param }, Function.createDelegate(this, this._updateSucces));
    },
    _updateSuccess: function (data) {
        alert("yeah i´m get updated");
        this._updating = false
        this._xhr = null;

    },
    _checkXhr: function () {

        if (this._xhr()) {
            if (confirm("There is an active call to the Server. If you wait to long, it may have been broken. Do you want to Abort the current call?")) {
                this._xhr.get_executor().abort();
                this._xhr = null;
                return true;
            } else {
                return false;
            }
        }

        return true;

    },
    dispose: function () {
        myproject.updateControl.callBaseMethod(this, 'dispose');
    }
}

myproject.updateControl.registerClass('myproject.updateControl', Sys.Component);

usage

$create(myproject.updateControl);

or

var upd = new myproject.updateControl();
upd.initialize();
1
Sean On

"Timer" on the client side is a bad idea. You can use setInterval(method, timespan) to force a call every n milliseconds, but if the server ever gets backed up, you can then start stacking requests and you'll start getting responses out of order (even on a non-slow network).

I recommend using setTimeout(method, timespan) in your ajax code in the call processing logic to setup the next call.

Example (using jQuery):

function getStuff()
{
  $.get(
    'myurl.aspx?r=' + Math.random(), // stop caching issues
    function(data) {
      $('#myDiv').html(data);
      setTimeout(getStuff, 2000); // you might want to set this to 1900 if you need it closer to every 2 seconds  
    }
  );
}
setTimeout(getStuff, 2000); // the initial timer initialization