[MediaWiki-commits] [Gerrit] Enhanced RC: Optimization of the initial collapsing - change (mediawiki/core)
TheDJ has submitted this change and it was merged. Change subject: Enhanced RC: Optimization of the initial collapsing .. Enhanced RC: Optimization of the initial collapsing * mediawiki.special.changeslist.enhanced: Hide the rows that would be hidden by jquery.makeCollapsible with CSS to save us some reflows and repaints. This doesn't work on browsers that don't fully support CSS2 (IE6), but it's okay, this will be done in JavaScript with old degraded performance instead. * jquery.makeCollapsible: Allow the element to be hidden on initial toggle without removing and adding back the 'mw-collapsed' class. This wasn't a performance issue in the past, but now it would cause the newly added CSS rules to have to be recalculated (although browsers seem to optimize it and avoid repaints at least). Bug: 51749 Change-Id: I3823c2a67d524e6598e2437e1dd065659d1c7e41 --- M resources/jquery/jquery.makeCollapsible.js M resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css 2 files changed, 18 insertions(+), 4 deletions(-) Approvals: TheDJ: Looks good to me, approved jenkins-bot: Verified diff --git a/resources/jquery/jquery.makeCollapsible.js b/resources/jquery/jquery.makeCollapsible.js index 5ca0b12..0fb66e2 100644 --- a/resources/jquery/jquery.makeCollapsible.js +++ b/resources/jquery/jquery.makeCollapsible.js @@ -172,7 +172,12 @@ } } - wasCollapsed = $collapsible.hasClass( 'mw-collapsed' ); + // This allows the element to be hidden on initial toggle without fiddling with the class + if ( options.wasCollapsed !== undefined ) { + wasCollapsed = options.wasCollapsed; + } else { + wasCollapsed = $collapsible.hasClass( 'mw-collapsed' ); + } // Toggle the state of the collapsible element (that is, expand or collapse) $collapsible.toggleClass( 'mw-collapsed', !wasCollapsed ); @@ -367,11 +372,9 @@ // Initial state if ( options.collapsed || $collapsible.hasClass( 'mw-collapsed' ) ) { - // Remove here so that the toggler goes in the right direction (the class is re-added) - $collapsible.removeClass( 'mw-collapsed' ); // One toggler can hook to multiple elements, and one element can have // multiple togglers. This is the sanest way to handle that. - actionHandler.call( $toggleLink.get( 0 ), null, { instantHide: true } ); + actionHandler.call( $toggleLink.get( 0 ), null, { instantHide: true, wasCollapsed: false } ); } } ); }; diff --git a/resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css b/resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css index 2632c78..bed580d 100644 --- a/resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css +++ b/resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css @@ -37,6 +37,17 @@ display: none; } +/* + * And if it's enabled, let's optimize the collapsing a little: hide the rows + * that would be hidden by jquery.makeCollapsible with CSS to save us some + * reflows and repaints. This doesn't work on browsers that don't fully support + * CSS2 (IE6), but it's okay, this will be done in JavaScript with old degraded + * performance instead. + */ +.client-js table.mw-enhanced-rc.mw-collapsed tr + tr { + display: none; +} + .mw-enhancedchanges-arrow-space { display: inline-block; *display: inline; /* IE7 and below */ -- To view, visit https://gerrit.wikimedia.org/r/74955 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: merged Gerrit-Change-Id: I3823c2a67d524e6598e2437e1dd065659d1c7e41 Gerrit-PatchSet: 2 Gerrit-Project: mediawiki/core Gerrit-Branch: master Gerrit-Owner: Matmarex matma@gmail.com Gerrit-Reviewer: Catrope roan.katt...@gmail.com Gerrit-Reviewer: Helder.wiki helder.w...@gmail.com Gerrit-Reviewer: Matmarex matma@gmail.com Gerrit-Reviewer: Nemo bis federicol...@tiscali.it Gerrit-Reviewer: TheDJ hartman.w...@gmail.com Gerrit-Reviewer: jenkins-bot ___ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
[MediaWiki-commits] [Gerrit] Enhanced RC: Optimization of the initial collapsing - change (mediawiki/core)
Matmarex has uploaded a new change for review. https://gerrit.wikimedia.org/r/74955 Change subject: Enhanced RC: Optimization of the initial collapsing .. Enhanced RC: Optimization of the initial collapsing * mediawiki.special.changeslist.enhanced: Hide the rows that would be hidden by jquery.makeCollapsible with CSS to save us some reflows and repaints. This doesn't work on browsers that don't fully support CSS2 (IE6), but it's okay, this will be done in JavaScript with old degraded performance instead. * jquery.makeCollapsible: Allow the element to be hidden on initial toggle without removing and adding back the 'mw-collapsed' class. This wasn't a performance issue in the past, but now it would cause the newly added CSS rules to have to be recalculated (although browsers seem to optimize it and avoid repaints at least). Bug: 51749 Change-Id: I3823c2a67d524e6598e2437e1dd065659d1c7e41 --- M resources/jquery/jquery.makeCollapsible.js M resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css 2 files changed, 18 insertions(+), 4 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/core refs/changes/55/74955/1 diff --git a/resources/jquery/jquery.makeCollapsible.js b/resources/jquery/jquery.makeCollapsible.js index 5ca0b12..0fb66e2 100644 --- a/resources/jquery/jquery.makeCollapsible.js +++ b/resources/jquery/jquery.makeCollapsible.js @@ -172,7 +172,12 @@ } } - wasCollapsed = $collapsible.hasClass( 'mw-collapsed' ); + // This allows the element to be hidden on initial toggle without fiddling with the class + if ( options.wasCollapsed !== undefined ) { + wasCollapsed = options.wasCollapsed; + } else { + wasCollapsed = $collapsible.hasClass( 'mw-collapsed' ); + } // Toggle the state of the collapsible element (that is, expand or collapse) $collapsible.toggleClass( 'mw-collapsed', !wasCollapsed ); @@ -367,11 +372,9 @@ // Initial state if ( options.collapsed || $collapsible.hasClass( 'mw-collapsed' ) ) { - // Remove here so that the toggler goes in the right direction (the class is re-added) - $collapsible.removeClass( 'mw-collapsed' ); // One toggler can hook to multiple elements, and one element can have // multiple togglers. This is the sanest way to handle that. - actionHandler.call( $toggleLink.get( 0 ), null, { instantHide: true } ); + actionHandler.call( $toggleLink.get( 0 ), null, { instantHide: true, wasCollapsed: false } ); } } ); }; diff --git a/resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css b/resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css index 2632c78..ba84ca2 100644 --- a/resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css +++ b/resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css @@ -37,6 +37,17 @@ display: none; } +/* + * And if it's enabled, let's optimize the collapsing a little: hide the rows + * that would be hidden by jquery.makeCollapsible with CSS to save us some + * reflows and repaints. This doesn't work on browsers that don't fully support + * CSS2 (IE6), but it's okay, this will be done in JavaScript with old degraded + * performance instead. + */ +.client-js table.mw-enhanced-rc.mw-collapsed tr ~ tr { + display: none; +} + .mw-enhancedchanges-arrow-space { display: inline-block; *display: inline; /* IE7 and below */ -- To view, visit https://gerrit.wikimedia.org/r/74955 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I3823c2a67d524e6598e2437e1dd065659d1c7e41 Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/core Gerrit-Branch: master Gerrit-Owner: Matmarex matma@gmail.com ___ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits