compactlinks: Optimise performance of DOM logic
The createCompactList() function runs synchronously during the module execution burst. Due to it visually changing the page, I won't defer it with rIC for the time being, although that should be considered for the future. For this commit, I'm trying to make it fit the budget of <50ms because ULS is currently usually taking 80ms-180ms on desktop (MacBook/Chrome CPU/4), and that's during batch execution with other modules as well, thus freezing the UI thread for much longer than that. constructor: * Remove needless clone of jQuery object. Use $foo instead of $( $foo ). * Remove creation of 'interlanguageList' and 'compactList' objects that are immediately removed and re-created by init(). init/getInterlanguageList: * Use the HTMLElement.lang and HTMLAnchorElement.href properties directly instead of the DOM getAttribute(). This means stores a full url instead of a relative url, which should help avoid other bugs in the future. * Remove needless jQuery() constructor and jQuery.text() call. Use Node.textContent directly instead. * Use HTMLElement#querySelectorAll instead of jQuery#find(). init/getCompactList/../filterByLangsInText: * Avoid jQuery() constructor and jQuery.attr(), use the HTMLElement.lang property directly. * Avoid jQuery() selector, call querySelectorAll directly. init/getCompactList/../getCommonLanguages/../getFrequentLanguageList: * Avoid temporary array copies from concat() and function overhead with forEach() and filter(). Instead, keep only a single array, and iterate it once. init/getCompactList/../filterByBadges (~10m -> ~0.5ms): * Use one query via $(), instead of two queries $()+find(). * Use $.map() directly instead of map()+fakejQueryObject+toArray(). * Use querySelector(One) for the child instead of $()+find(). * Use HTMLElement.lang property directly. init/hideOriginal (~5m -> ~0.8ms): * Use querySelectorAll() directly instead of jQuery find(). * Set HTMLElement.style directly instead of jQuery() css(). init/render/addTrigger: * Use createElement() and direct properties instead of $(), addClass(), prop() and text(). * The mw.msg() calls use text() and jqueryMsg#parser which is expensive. Use plain() for 'ext-uls-compact-link-info', which doesn't need parsing. Keep text() for the other message, and document why. init/listen: * Use async Deferred#then() instead of sometimes-sync Deferred#done(). Bug: T127328 Change-Id: I424c34fb82c8e95407f7b934e6d42019becbf909
This commit is contained in:
@@ -180,35 +180,34 @@
|
||||
* @return {Array} List of language codes without duplicates.
|
||||
*/
|
||||
mw.uls.getFrequentLanguageList = function ( countryCode ) {
|
||||
var unique = [],
|
||||
list = [
|
||||
mw.config.get( 'wgUserLanguage' ),
|
||||
mw.config.get( 'wgContentLanguage' ),
|
||||
mw.uls.getBrowserLanguage()
|
||||
]
|
||||
.concat( mw.uls.getPreviousLanguages() )
|
||||
.concat( mw.uls.getAcceptLanguageList() );
|
||||
var i, j, lang,
|
||||
ret = [],
|
||||
lists = [
|
||||
[
|
||||
mw.config.get( 'wgUserLanguage' ),
|
||||
mw.config.get( 'wgContentLanguage' ),
|
||||
mw.uls.getBrowserLanguage()
|
||||
],
|
||||
mw.uls.getPreviousLanguages(),
|
||||
mw.uls.getAcceptLanguageList()
|
||||
];
|
||||
|
||||
countryCode = countryCode || mw.uls.getCountryCode();
|
||||
|
||||
if ( countryCode ) {
|
||||
list = list.concat( $.uls.data.getLanguagesInTerritory( countryCode ) );
|
||||
lists.push( $.uls.data.getLanguagesInTerritory( countryCode ) );
|
||||
}
|
||||
|
||||
list.forEach( function ( lang ) {
|
||||
if ( unique.indexOf( lang ) === -1 ) {
|
||||
unique.push( lang );
|
||||
for ( i = 0; i < lists.length; i++ ) {
|
||||
for ( j = 0; j < lists[ i ].length; j++ ) {
|
||||
lang = lists[ i ][ j ];
|
||||
// Make flat, make unique, and ignore unknown/unsupported languages
|
||||
if ( ret.indexOf( lang ) === -1 && $.uls.data.getAutonym( lang ) !== lang ) {
|
||||
ret.push( lang );
|
||||
}
|
||||
}
|
||||
} );
|
||||
}
|
||||
|
||||
// Filter out unknown and unsupported languages
|
||||
unique = unique.filter( function ( langCode ) {
|
||||
// If the language is already known and defined, just use it.
|
||||
// $.uls.data.getAutonym will resolve redirects if any.
|
||||
return $.uls.data.getAutonym( langCode ) !== langCode;
|
||||
} );
|
||||
|
||||
return unique;
|
||||
return ret;
|
||||
};
|
||||
|
||||
}() );
|
||||
|
||||
Reference in New Issue
Block a user