Jdlrobson has uploaded a new change for review.
https://gerrit.wikimedia.org/r/278204
Change subject: Reduce the initial JavaScript payload
......................................................................
Reduce the initial JavaScript payload
Reduce the initial JS payload by 17kb
Changes:
* Avoid loading the mobile.issues library until needed
** Fix an issue with the icon preventing it from showing in the overlay
** Move the bootstrap script into skins.minerva.scripts
** Remove qunit test which is covered in browser tests and not a true
unit test.
* Avoid loading the entire mobile.search module on startup - instead break the
logging code into a lightweight mobile.search.logger module
Change-Id: Ib258bc78f54b551effeaa6978f92c05d9fb7310f
---
M extension.json
D resources/mobile.issues/cleanuptemplates.js
M resources/mobile.issues/issues.less
R resources/mobile.search.logger/MobileWebSearchLogger.js
A resources/skins.minerva.scripts/cleanup.less
M resources/skins.minerva.scripts/init.js
M resources/skins.minerva.scripts/initCleanuptemplates.js
M resources/skins.minerva.scripts/search.js
D tests/qunit/mobile.issues/test_cleanuptemplates.js
R tests/qunit/mobile.search.logger/test_MobileWebSearchLogger.js
10 files changed, 58 insertions(+), 197 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/04/278204/1
diff --git a/extension.json b/extension.json
index 15ef9c4..67daa05 100644
--- a/extension.json
+++ b/extension.json
@@ -235,7 +235,7 @@
"selector": ".mw-ui-icon-{name}:before",
"images": {
"cleanup":
"resources/mobile.issues.images/blue-triangle.svg",
- "cleanup->gray":
"resources/mobile.issues.images/gray-triangle.svg"
+ "cleanup-gray":
"resources/mobile.issues.images/gray-triangle.svg"
}
},
"mobile.toc.images": {
@@ -809,15 +809,13 @@
"class": "MFResourceLoaderParsedMessageModule",
"dependencies": [
"mobile.pagelist.scripts",
- "mobile.overlays",
- "mobile.loggingSchemas"
+ "mobile.overlays"
],
"styles": [
"resources/mobile.search/SearchOverlay.less"
],
"scripts": [
- "resources/mobile.search/SearchOverlay.js",
-
"resources/mobile.search/MobileWebSearchLogger.js"
+ "resources/mobile.search/SearchOverlay.js"
],
"templates": {
"SearchOverlay.hogan":
"resources/mobile.search/SearchOverlay.hogan"
@@ -833,8 +831,23 @@
"4": "mobile-frontend-search-feedback-link-text"
}
},
+ "mobile.search.logger": {
+ "targets": [
+ "mobile",
+ "desktop"
+ ],
+ "dependencies": [
+ "mobile.loggingSchemas"
+ ],
+ "scripts": [
+
"resources/mobile.search.logger/MobileWebSearchLogger.js"
+ ]
+ },
"mobile.search.api": {
- "class": "MFResourceLoaderParsedMessageModule",
+ "targets": [
+ "mobile",
+ "desktop"
+ ],
"dependencies": [
"mobile.startup",
"mediawiki.Title"
@@ -1238,15 +1251,7 @@
"resources/mobile.issues/issues.less"
],
"scripts": [
- "resources/mobile.issues/CleanupOverlay.js",
- "resources/mobile.issues/cleanuptemplates.js"
- ],
- "messages": [
- "mobile-frontend-meta-data-issues",
- "mobile-frontend-meta-data-issues-talk",
- "mobile-frontend-meta-data-issues-header",
- "mobile-frontend-meta-data-issues-header-talk",
- "mobile-frontend-meta-data-issues-categories"
+ "resources/mobile.issues/CleanupOverlay.js"
]
},
"mobile.nearby": {
@@ -1598,8 +1603,7 @@
"mobile.startup",
"mobile.mainMenu",
"mobile.loggingSchemas",
- "mobile.issues",
- "mobile.search",
+ "mobile.search.logger",
"mobile.references",
"mobile.betaoptin",
"mobile.toast",
@@ -1615,11 +1619,20 @@
"mobile-frontend-last-modified-with-user-months",
"mobile-frontend-last-modified-with-user-years",
"mobile-frontend-last-modified-with-user-just-now",
- "mobile-frontend-cookies-required"
+ "mobile-frontend-cookies-required",
+ "mobile-frontend-meta-data-issues",
+ "mobile-frontend-meta-data-issues-talk",
+ "mobile-frontend-meta-data-issues-header",
+ "mobile-frontend-meta-data-issues-header-talk",
+ "mobile-frontend-meta-data-issues-categories"
+ ],
+ "styles": [
+ "resources/skins.minerva.scripts/cleanup.less"
],
"scripts": [
"resources/skins.minerva.scripts/preInit.js",
"resources/skins.minerva.scripts/init.js",
+
"resources/skins.minerva.scripts/initCleanupTemplates.js",
"resources/skins.minerva.scripts/initLogging.js",
"resources/skins.minerva.scripts/mobileRedirect.js",
"resources/skins.minerva.scripts/search.js"
diff --git a/resources/mobile.issues/cleanuptemplates.js
b/resources/mobile.issues/cleanuptemplates.js
deleted file mode 100644
index b3213f5..0000000
--- a/resources/mobile.issues/cleanuptemplates.js
+++ /dev/null
@@ -1,126 +0,0 @@
-( function ( M, $ ) {
-
- var module = ( function () {
- var overlayManager = M.require( 'mobile.startup/overlayManager'
),
- CleanupOverlay = M.require(
'mobile.issues/CleanupOverlay' );
-
- /**
- * Extract a summary message from a cleanup template generated
element that is
- * friendly for mobile display.
- * @param {Object} $box element to extract the message from
- * @ignore
- * @return {String} html of message.
- */
- function extractMessage( $box ) {
- var selector = '.mbox-text, .ambox-text',
- $container = $( '<div>' );
-
- $box.find( selector ).each( function () {
- var contents,
- $this = $( this );
- // Clean up talk page boxes
- $this.find( 'table, .noprint' ).remove();
- contents = $this.html();
-
- if ( contents ) {
- $( '<p>' ).html( contents ).appendTo(
$container );
- }
- } );
- return $container.html();
- }
-
- /**
- * Create a link element that opens the issues overlay.
- *
- * @ignore
- *
- * @param {String} labelText The text value of the element
- * @return {jQuery}
- */
- function createLinkElement( labelText ) {
- return $( '<a class="cleanup mw-mf-cleanup"></a>' )
- .text( labelText );
- }
-
- /**
- * Render a banner in a containing element.
- * @param {jQuery.Object} $container to render the page issues
banner inside.
- * @param {String} labelText what the label of the page issues
banner should say
- * @param {String} headingText the heading of the overlay that
is created when the page issues banner is clicked
- * @ignore
- */
- function createBanner( $container, labelText, headingText ) {
- var selector = 'table.ambox, table.tmbox, table.cmbox',
- $metadata = $container.find( selector ),
- issues = [],
- $link;
-
- // clean it up a little
- $metadata.find( '.NavFrame' ).remove();
-
- $metadata.each( function () {
- var content,
- $this = $( this );
-
- if ( $this.find( selector ).length === 0 ) {
- content = extractMessage( $this );
- if ( content ) {
- issues.push( {
- text: content
- } );
- }
- }
- } );
-
- $link = createLinkElement( labelText );
- $link.attr( 'href', '#/issues' );
-
- overlayManager.add( /^\/issues$/, function () {
- return new CleanupOverlay( {
- issues: issues,
- headingText: headingText
- } );
- } );
-
- if ( $metadata.length ) {
- $link.insertAfter( $( 'h1#section_0' ) );
-
- $metadata.remove();
- }
- }
-
- /**
- * Scan an element for any known cleanup templates and replace
them with a button
- * that opens them in a mobile friendly overlay.
- * @ignore
- */
- function initPageIssues() {
- var ns = mw.config.get( 'wgNamespaceNumber' ),
- // Categories have no lead section
- $container = ns === 14 ? $( '#bodyContent' )
- :
M.getCurrentPage().getLeadSectionElement(),
- labelMsgKey =
'mobile-frontend-meta-data-issues';
-
- if ( ns === 0 ) {
- createBanner( $container, mw.msg( labelMsgKey ),
- mw.msg(
'mobile-frontend-meta-data-issues-header' ) );
- // Create a banner for talk pages (namespace 1) in beta
mode to make them more readable.
- } else if ( ns === 1 ) {
- createBanner( $container, mw.msg(
'mobile-frontend-meta-data-issues-talk' ),
- mw.msg(
'mobile-frontend-meta-data-issues-header-talk' ) );
- } else if ( ns === 14 ) {
- createBanner( $container, mw.msg(
'mobile-frontend-meta-data-issues-categories' ),
- mw.msg(
'mobile-frontend-meta-data-issues-header-talk' ) );
- }
- }
-
- return {
- init: initPageIssues,
- createBanner: createBanner,
- _extractMessage: extractMessage
- };
- }() );
-
- M.define( 'mobile.issues/cleanuptemplates', module );
-
-}( mw.mobileFrontend, jQuery ) );
diff --git a/resources/mobile.issues/issues.less
b/resources/mobile.issues/issues.less
index 795e0a9..cfbc5c0 100644
--- a/resources/mobile.issues/issues.less
+++ b/resources/mobile.issues/issues.less
@@ -5,14 +5,6 @@
@smallIconSize: 24px;
@largeIconSize: 50px;
-.mw-mf-cleanup {
- display: block;
- margin: 0;
- padding: 0;
- font-size: .8em;
- color: @colorGray7;
-}
-
// overlay styles
.overlay {
.cleanup {
diff --git a/resources/mobile.search/MobileWebSearchLogger.js
b/resources/mobile.search.logger/MobileWebSearchLogger.js
similarity index 97%
rename from resources/mobile.search/MobileWebSearchLogger.js
rename to resources/mobile.search.logger/MobileWebSearchLogger.js
index fe41491..ced5a85 100644
--- a/resources/mobile.search/MobileWebSearchLogger.js
+++ b/resources/mobile.search.logger/MobileWebSearchLogger.js
@@ -123,6 +123,6 @@
} );
};
- M.define( 'mobile.search/MobileWebSearchLogger', MobileWebSearchLogger
);
+ M.define( 'mobile.search.logger/MobileWebSearchLogger',
MobileWebSearchLogger );
}( mw.mobileFrontend, mw, jQuery ) );
diff --git a/resources/skins.minerva.scripts/cleanup.less
b/resources/skins.minerva.scripts/cleanup.less
new file mode 100644
index 0000000..9167f68
--- /dev/null
+++ b/resources/skins.minerva.scripts/cleanup.less
@@ -0,0 +1,8 @@
+@import "minerva.variables";
+.mw-mf-cleanup {
+ display: block;
+ margin: 0;
+ padding: 0;
+ font-size: .8em;
+ color: @colorGray7;
+}
\ No newline at end of file
diff --git a/resources/skins.minerva.scripts/init.js
b/resources/skins.minerva.scripts/init.js
index 898ddd1..cea677e 100644
--- a/resources/skins.minerva.scripts/init.js
+++ b/resources/skins.minerva.scripts/init.js
@@ -9,7 +9,6 @@
context = M.require( 'mobile.context/context' ),
// FIXME: Don't pull in the mobile.references library on
startup. Lazy load it when needed
references = M.require( 'mobile.references/references' ),
- cleanuptemplates = M.require( 'mobile.issues/cleanuptemplates'
),
useNewMediaViewer = context.isBetaGroupMember(),
overlayManager = M.require( 'mobile.startup/overlayManager' ),
page = M.getCurrentPage(),
@@ -250,13 +249,6 @@
.appendTo(
M.getCurrentPage().getLeadSectionElement() );
}
}
-
- // Setup the issues banner on the page
- cleanuptemplates.init();
- // Show it in edit preview.
- M.on( 'edit-preview', function ( overlay ) {
- cleanuptemplates.init( overlay.$el );
- } );
// let the interested parties know whether the panel is shown
mw.track( 'minerva.betaoptin', {
diff --git a/resources/skins.minerva.scripts/initCleanuptemplates.js
b/resources/skins.minerva.scripts/initCleanuptemplates.js
index cb5e8fd..ddffea9 100644
--- a/resources/skins.minerva.scripts/initCleanuptemplates.js
+++ b/resources/skins.minerva.scripts/initCleanuptemplates.js
@@ -1,6 +1,7 @@
( function ( M, $ ) {
-
- var module = ( function () {
+ var moduleLoader = M.require( 'mobile.overlays/moduleLoader' );
+
+ var cleanuptemplates = ( function () {
var overlayManager = M.require( 'mobile.startup/overlayManager'
);
/**
@@ -75,19 +76,21 @@
$link.attr( 'href', '#/issues' );
overlayManager.add( /^\/issues$/, function () {
- mw.loader.using( 'mobile.issues' ).done(
function () {
+ var result = $.Deferred();
+ moduleLoader.loadModule( 'mobile.issues'
).done( function () {
var CleanupOverlay = M.require(
'mobile.issues/CleanupOverlay' );
- return new CleanupOverlay( {
+ result.resolve( new CleanupOverlay( {
issues: issues,
headingText: headingText
- } );
- } )
+ } ) );
+ } );
+ return result;
} );
if ( $metadata.length ) {
$link.insertAfter( $( 'h1#section_0' ) );
- $metadata.remove();
+ $metadata.empty();
}
}
@@ -123,6 +126,11 @@
};
}() );
- M.define( 'mobile.issues/cleanuptemplates', module );
+ // Setup the issues banner on the page
+ cleanuptemplates.init();
+ // Show it in edit preview.
+ M.on( 'edit-preview', function ( overlay ) {
+ cleanuptemplates.init( overlay.$el );
+ } );
}( mw.mobileFrontend, jQuery ) );
diff --git a/resources/skins.minerva.scripts/search.js
b/resources/skins.minerva.scripts/search.js
index fa29ca9..a0e0353 100644
--- a/resources/skins.minerva.scripts/search.js
+++ b/resources/skins.minerva.scripts/search.js
@@ -55,6 +55,6 @@
.prop( 'readonly', true );
}
- M.require( 'mobile.search/MobileWebSearchLogger' ).register();
+ M.require( 'mobile.search.logger/MobileWebSearchLogger' ).register();
}( mw.mobileFrontend, jQuery ) );
diff --git a/tests/qunit/mobile.issues/test_cleanuptemplates.js
b/tests/qunit/mobile.issues/test_cleanuptemplates.js
deleted file mode 100644
index 0938338..0000000
--- a/tests/qunit/mobile.issues/test_cleanuptemplates.js
+++ /dev/null
@@ -1,26 +0,0 @@
-( function ( M, $ ) {
-
- var cleanuptemplates = M.require( 'mobile.issues/cleanuptemplates' );
-
- QUnit.module( 'MobileFrontend issues', {
- setup: function () {
- $( '<div id="mfe-test-issues">' +
- mw.template.get( 'tests.mobilefrontend', 'issues.hogan'
).text +
- '</div>' ).appendTo( '#qunit-fixture' );
- },
- teardown: function () {
- $( '#mfe-test-issues' ).remove();
- }
- } );
-
- QUnit.test( '#nested tables text extraction', 1, function ( assert ) {
- var issues = cleanuptemplates._extractMessage( $(
'#mfe-test-issues' ) );
-
- assert.strictEqual(
- $.trim( issues ),
- '<p>Level 1</p><p>Nested 1</p><p>Nested-nested 1</p>',
- 'Correct text Extraction'
- );
- } );
-
-}( mw.mobileFrontend, jQuery ) );
diff --git a/tests/qunit/mobile.search/test_MobileWebSearchLogger.js
b/tests/qunit/mobile.search.logger/test_MobileWebSearchLogger.js
similarity index 97%
rename from tests/qunit/mobile.search/test_MobileWebSearchLogger.js
rename to tests/qunit/mobile.search.logger/test_MobileWebSearchLogger.js
index f635278..d5b521f 100644
--- a/tests/qunit/mobile.search/test_MobileWebSearchLogger.js
+++ b/tests/qunit/mobile.search.logger/test_MobileWebSearchLogger.js
@@ -1,7 +1,7 @@
( function ( M ) {
var SchemaMobileWebSearch = M.require(
'mobile.loggingSchemas/SchemaMobileWebSearch' ),
- MobileWebSearchLogger = M.require(
'mobile.search/MobileWebSearchLogger' );
+ MobileWebSearchLogger = M.require(
'mobile.search.logger/MobileWebSearchLogger' );
QUnit.module( 'MobileFrontend: MobileWebSearchLogger', {
setup: function () {
--
To view, visit https://gerrit.wikimedia.org/r/278204
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Ib258bc78f54b551effeaa6978f92c05d9fb7310f
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Jdlrobson <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
