Side navigation
#4038 closed enhancement (fixed)
Opened February 01, 2009 03:14PM UTC
Closed February 09, 2009 03:58PM UTC
Improving .hide() method to avoiding reflow to constantly occur
Reported by: | zextra | Owned by: | |
---|---|---|---|
Priority: | minor | Milestone: | 1.3.2 |
Component: | effects | Version: | 1.3.1 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
.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
Attachments (0)
Change History (1)
Changed February 09, 2009 03:58PM UTC by comment:1
component: | unfilled → fx |
---|---|
resolution: | → fixed |
status: | new → closed |
Fixed in SVN rev [6191].