Make ULS language selector appear faster after clicking trigger

* Removed unused class end.
* Class uls-lcd-region-section was used in two different elements,
  retained it on the outer one.
* Build a list of languages per region, once done render the regions at once.
* Use direct dom manipulation in hot spots.
* Use shorter selectors like children instead of find and dropping the tag name.
* Fixed mismatch when there were no results and when the message was shown.
* Less flickering by not hiding or showing regions unnecessary
* Cache the common languages "quicklist"
* Added itemsPerColumn as an option

Reduces time used to show language selector after clicking the trigger on my
machine from about 1.8s to about 380 ms (JS execution times, actual times are
about the same but little bigger. The actual rendering is now less than 100ms,
the rest is other setup overheard and $.fn.scrollIntoView which can take many
hundreds of milliseconds.
This commit is contained in:
Niklas Laxström
2013-12-20 10:31:04 +00:00
parent 2eec9fae96
commit 78e9b83c6b
2 changed files with 195 additions and 138 deletions

View File

@@ -188,8 +188,9 @@
this.selectedLanguage = langCode;
}
this.render( langCode );
this.resultCount++;
if ( this.render( langCode ) ) {
this.resultCount++;
}
}
}
}
@@ -212,8 +213,9 @@
languageFilter.autofill( code, name );
}
languageFilter.render( code );
languageFilter.resultCount++;
if ( languageFilter.render( code ) ) {
languageFilter.resultCount++;
}
} );
languageFilter.resultHandler( query );
@@ -278,10 +280,10 @@
var $target = this.options.$target;
if ( !$target ) {
return;
return false;
}
$target.append( langCode, null );
return $target.append( langCode );
},
escapeRegex: function( value ) {