If you use ajaxStart or any other global trigger. The event.trigger()
code calls itself on all elements in the page by calling $('*') and
adding document and window to this collection.
This leads to some problems for me. A recent project has about 3300
elements if you do a $('*').size().
I have the obvious:
$('#loader').ajaxStart(function() { $(this).show() } ...
code going.
At first I was not even thinking about this to be the problem for the
gui delays. After some testing it was clear the delay is only
happening when I have the ajaxStart/ajaxStop callbacks.
To solve this problem I tried 2 things:
1. Limit the elements collected for the call of event.trigger without
an element by adding a new nodes selector. I named it :event and it
test against jQuery.data(a,"handle") to select only nodes which have a
jQuery event handler. This selector may be of interest for other
purposes too..
At least this is what I understand (I just jumped into the code for 30
minutes) what I did.
In 1.2.2 this would change the following code
// :animated
animated: "jQuery.grep(jQuery.timers,function(fn){return
a==fn.elem;}).length",
// :event
event: 'jQuery.data(a, "handle")'
and
// Handle a global trigger
if ( !elem ) {
// Only trigger if we've ever bound an event for it
if ( this.global[type] )
jQuery("*:event").add([window, document]).trigger(type, data);
But it still does a lot of "work" for a simple ajax activity
indicator... so I added another possibility.. less "cool" but way
better for the cpu-cycles:
2. I simply extendet axajSetup with 2 (yes only the 2 i need)
callbacks. Code changes are:
ajaxSettings: {
global: true,
type: "GET",
timeout: 0,
ajaxStart: null,
ajaxStop: null,
contentType: "application/x-www-form-urlencoded",
and...
// Watch for a new set of requests
if ( s.global && ! jQuery.active++ ) {
if (jQuery.isFunction(s.ajaxStart)) {
s.ajaxStart()
}
jQuery.event.trigger( "ajaxStart" );
and...
// Handle the global AJAX counter
if ( s.global && ! --jQuery.active )
if (jQuery.isFunction(s.ajaxStop)) {
s.ajaxStop()
}
jQuery.event.trigger( "ajaxStop" );
usage is clear:
$.ajaxSetup({ 'ajaxStart': function(){
$("#loading").show();
}, 'ajaxStop': function(){
$("#loading").hide();
}});
...
I did NOT do a nice DIFF.. no Line-Numbers.. and I am not going to
contribute into SVN... because I have no time.. do what you want with
my changes.. if at all.
Sinverely,
Hans Raaf
