I use it on an intranet I have developed for notification purposes.
By intercepting the state 3 I can notify the user that the request started.
I also use it to time the requests transmission times. I display the time elapsed between states 3 and 4.
Since I use MooTools I extended the Request class to fire the onStateChange event:
var EarlyRequest = new Class({Extends: Request,
onStateChange: function() {
this.fireEvent("onStateChange", [this.xhr.readyState]);
this.parent();
}
});
On an additional note. The definitions of the states that you posted (from w3cschools) are misleading, these are clearer to me (from http://www.w3.org/TR/XMLHttpRequest/#states):
UNSENT (numeric value 0)
The object has been constructed.
OPENED (numeric value 1)
The open() method has been successfully invoked. During this state request headers can be set using setRequestHeader() and the request can be made using the send() method.
HEADERS_RECEIVED (numeric value 2)
All redirects (if any) have been followed and all HTTP headers of the final response have been received. Several response members of the object are now available.
LOADING (numeric value 3)
The response entity body is being received.
DONE (numeric value 4)
The data transfer has been completed or something went wrong during the transfer (e.g. infinite redirects).