wikimedia/mediawiki-skins-Vector
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git synced 2024-11-27 17:10:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge "Add client-side performance metrics for searchLoader"

Browse source
This commit is contained in:
jenkins-bot 2020-10-15 08:47:18 +00:00 committed by Gerrit Code Review
parent 4c1d528471 8cf278d305
commit 99f9597109
2 changed files with 40 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
resources/mediawiki.d.ts vendored
View file

@ -43,8 +43,12 @@ interface MediaWiki {
* Execute a function after one or more modules are ready.
*
* @param moduleName
* @param {Function} ready Callback to execute when all dependencies are
* ready.
* @param {Function} after Callback to execute if one or more dependencies
* failed.
*/
using( moduleName: string|null ): JQuery.Promise<any>;
using( moduleName: string|null, ready?: Function, error?: Function ): JQuery.Promise<any>;
/**
* Load a given resourceLoader module.

38
resources/skins.vector.js/searchLoader.js
View file

@ -11,6 +11,17 @@
var /** @type {VectorResourceLoaderVirtualConfig} */
config = require( /** @type {string} */ ( './config.json' ) ),
// T251544: Collect search performance metrics to compare Vue search with
// mediawiki.searchSuggest performance.
SHOULD_TEST_SEARCH = !!(
!config.wgVectorUseCoreSearch &&
window.performance &&
performance.mark &&
performance.measure &&
performance.getEntriesByName ),
LOAD_START_MARK = 'mwVectorVueSearchLoadStart',
LOAD_END_MARK = 'mwVectorVueSearchLoadEnd',
LOAD_MEASURE = 'mwVectorVueSearchLoadStartToLoadEnd',
SEARCH_FORM_ID = 'simpleSearch',
SEARCH_INPUT_ID = 'searchInput',
SEARCH_LOADING_CLASS = 'search-form__loader',
@ -32,7 +43,10 @@ var /** @type {VectorResourceLoaderVirtualConfig} */
function loadSearchModule( element, moduleName, afterLoadFn ) {
function requestSearchModule() {
mw.loader.using( moduleName ).then( afterLoadFn );
if ( SHOULD_TEST_SEARCH ) {
performance.mark( LOAD_START_MARK );
}
mw.loader.using( moduleName, afterLoadFn );
element.removeEventListener( 'focus', requestSearchModule );
}
@ -101,6 +115,16 @@ function setLoadingIndicatorListeners( element, attach, eventCallback ) {
}
}
/**
* Marks when the lazy load has completed.
*/
function markLoadEnd() {
if ( SHOULD_TEST_SEARCH && performance.getEntriesByName( LOAD_START_MARK ).length ) {
performance.mark( LOAD_END_MARK );
performance.measure( LOAD_MEASURE, LOAD_START_MARK, LOAD_END_MARK );
}
}
/**
* Initialize the loading of the search module as well as the loading indicator.
* Only initialize the loading indicator when not using the core search module.
@ -128,9 +152,17 @@ function initSearchLoader( document ) {
loadSearchModule(
searchInput,
SEARCH_MODULE_NAME,
setLoadingIndicatorListeners.bind( null,
searchForm, false, renderSearchLoadingIndicator )
function () {
markLoadEnd();
setLoadingIndicatorListeners(
/** @type {HTMLElement} */ ( searchForm ),
false,
renderSearchLoadingIndicator
);
}
);
}
}