Improving .hide() method to avoiding reflow to constantly occur

[zextra]

.hide() method, in its current state, when applied to many elements (something like 1000 elements), triggers a bug in webkit-based browsers, which has to do with document reflow constantly occuring so many times.

I'm not sure if hide() is the only method that could use this same kind of optimization.

[following is credited to Mark Rowe (a.k.a. bdash) of Apple Corp.]

I suspect that a trivial change to jQuery could be made to avoid tickling this performance cliff. If the "hide" method were changed to use two separate loops it would avoid modifying the style info between each query of the "display" property and would therefore avoid the need to re-layout so many times. Something like the following:

hide: function(speed,callback){

if ( speed ) {

return this.animate( genFx("hide", 3), speed, callback);

} else {

for ( var i = 0, l = this.length; i < l; i++ ){

var old = jQuery.data(this[i], "olddisplay"); if ( !old && old !== "none" )

jQuery.data(this[i], "olddisplay", jQuery.css(this[i], "display"));

} for ( var i = 0, l = this.length; i < l; i++ )

this[i].style.display = "none";

}

},

Regards, Boris

[john]

Fixed in SVN rev [6191].