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