if(!$.browser.msie) { /* SORRY, BUT IE IS *SLOW* WITH JQUERY */
uls = $("#metrics ul:visible"); /* Nasty hack: */
uls.hide(); /* 500x speedup on Chrome */
if(text == "") {
$(field_search).parents(".search_realm").find(".search_item").show();
} else {
$(field_search).parents(".search_realm").find(".search_item[id*="+text+"]").show();
$(field_search).parents(".search_realm").find(".search_item:not([id*="+text+"])").hide();
}
uls.show();
} else { /* IE SPECIFIC ALGORITHM (x10 speedup on IE) */
$( field_search ).parents(".search_realm").find(".search_item").each(function(){
if(this.id.indexOf(text) == -1){
$(this).hide();
} else {
$(this).show();
}
});
}
So, what happened here?
1. The horrible, horrible Chrome performance was due to a too-early rendering attempt. Hiding the containing ul makes Chrome stop trying to render after each element "reappears" and causes no flicker on the screen. The time goes from 12000ms to ~70ms for a 1549 element set.
2. IE didn't like jQuery. Well, don't make it use jQuery. Simple, huh? ;)
Now Chrome is an absolute performance champion with times 30/70, where as IE stays in the 320's and firefox in the 300/150's.

No comments:
Post a Comment