Phedenskog has uploaded a new change for review.
https://gerrit.wikimedia.org/r/271589
Change subject: Setup resource loader modules and structure
......................................................................
Setup resource loader modules and structure
Setup the basic setup for the resource loader, loading small startup
and then fire away the main module. However, we will probably split
it into multiple one and then load them async.
Alsp just a POC for backendtime and getting data from inspect.
Bug: T118204
Change-Id: I6d45a0b23045c3df14b0c0812edf6197437da4e6
---
M Gruntfile.js
M extension.json
M i18n/en.json
M i18n/qqq.json
A modules/ext.PerformanceInspector.css
M modules/ext.PerformanceInspector.startup.js
A modules/ext.PerformanceInspector.view.js
A modules/info/ext.PerformanceInspector.backendtime.js
A modules/info/ext.PerformanceInspector.modules.js
M package.json
10 files changed, 253 insertions(+), 39 deletions(-)
git pull
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/PerformanceInspector
refs/changes/89/271589/1
diff --git a/Gruntfile.js b/Gruntfile.js
index a0d8906..1691d1a 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -12,7 +12,8 @@
jshintrc: true
},
all: [
- 'modules/*.js'
+ 'modules/*.js',
+ 'modules/info/*.js'
]
},
jscs: {
diff --git a/extension.json b/extension.json
index 249495f..830285f 100644
--- a/extension.json
+++ b/extension.json
@@ -1,34 +1,56 @@
{
- "name": "PerformanceInspector",
- "version": "0.1.0",
- "author": [
+ "name": "PerformanceInspector",
+ "version": "0.1.0",
+ "author": [
"Peter Hedenskog"
],
- "url": "https://www.mediawiki.org/wiki/Extension:PerformanceInspector";,
- "descriptionmsg": "performanceinspector-desc",
- "license-name": "GPL-2.0+",
- "type": "other",
- "Hooks": {
- "BeforePageDisplay": [
+ "url": "https://www.mediawiki.org/wiki/Extension:PerformanceInspector";,
+ "descriptionmsg": "performanceinspector-desc",
+ "license-name": "GPL-2.0+",
+ "type": "other",
+ "Hooks": {
+ "BeforePageDisplay": [
"PerformanceInspectorHooks::onBeforePageDisplay"
]
- },
- "MessagesDirs": {
- "BoilerPlate": [
+ },
+ "MessagesDirs": {
+ "BoilerPlate": [
"i18n"
]
- },
- "ResourceModules": {
- "ext.PerformanceInspector.startup": {
- "scripts": "ext.PerformanceInspector.startup.js"
- }
- },
- "ResourceFileModulePaths": {
- "localBasePath": "modules",
- "remoteExtPath": "PerformanceInspector/modules"
- },
- "AutoloadClasses": {
- "PerformanceInspectorHooks": "PerformanceInspector.hooks.php"
- },
- "manifest_version": 1
+ },
+ "ResourceModules": {
+ "ext.PerformanceInspector.startup": {
+ "scripts": "ext.PerformanceInspector.startup.js",
+ "messages": "portlet-link-performance-inspector"
+ },
+ "ext.PerformanceInspector.view": {
+ "scripts": [
+ "ext.PerformanceInspector.view.js"
+ ],
+ "styles": "ext.PerformanceInspector.css",
+ "dependencies": [
+ "oojs",
+ "oojs-ui"
+ ],
+ "messages": [
+ "performanceinspector-title",
+ "result-summary",
+ "performanceinspector-result-summary"
+ ]
+ },
+ "ext.PerformanceInspector.analyze": {
+ "scripts": [
+ "info/ext.PerformanceInspector.modules.js",
+ "info/ext.PerformanceInspector.backendtime.js"
+ ]
+ }
+ },
+ "ResourceFileModulePaths": {
+ "localBasePath": "modules",
+ "remoteExtPath": "PerformanceInspector/modules"
+ },
+ "AutoloadClasses": {
+ "PerformanceInspectorHooks": "PerformanceInspector.hooks.php"
+ },
+ "manifest_version": 1
}
\ No newline at end of file
diff --git a/i18n/en.json b/i18n/en.json
index b905f29..57d4de6 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -1,6 +1,9 @@
{
- "@metadata": {
- "authors": []
- },
- "performanceinspector-desc": "This extension shows you page performance
metrics."
+ "@metadata": {
+ "authors": []
+ },
+ "performanceinspector-desc": "This extension shows you page performance
metrics.",
+ "performanceinspector-title": "Performance Inspector",
+ "portlet-link-performance-inspector": "Performance Inspector",
+ "performanceinspector-result-summary": "Summary"
}
\ No newline at end of file
diff --git a/i18n/qqq.json b/i18n/qqq.json
index be7f2db..4830080 100644
--- a/i18n/qqq.json
+++ b/i18n/qqq.json
@@ -2,5 +2,8 @@
"@metadata": {
"authors": []
},
- "performanceinspector-desc":
"{{desc|name=PerformanceInspector|url=http://www.mediawiki.org/wiki/Extension:PerformanceInspector}}";
+ "performanceinspector-desc":
"{{desc|name=PerformanceInspector|url=http://www.mediawiki.org/wiki/Extension:PerformanceInspector}}";,
+ "performanceinspector-title": "Performance Inspector",
+ "portlet-link-performance-inspector": "Performance Inspector",
+ "performanceinspector-result-summary": "Summary"
}
\ No newline at end of file
diff --git a/modules/ext.PerformanceInspector.css
b/modules/ext.PerformanceInspector.css
new file mode 100644
index 0000000..8b13789
--- /dev/null
+++ b/modules/ext.PerformanceInspector.css
@@ -0,0 +1 @@
+
diff --git a/modules/ext.PerformanceInspector.startup.js
b/modules/ext.PerformanceInspector.startup.js
index b088245..4e9d4be 100644
--- a/modules/ext.PerformanceInspector.startup.js
+++ b/modules/ext.PerformanceInspector.startup.js
@@ -1,6 +1,58 @@
/*jshint undef:false */
-( function () {
+( function ( mw, $ ) {
+ var $document = $( document );
- console.log( 'Running Performance Inspector startup' );
+ $document.ready( function () {
+ var caPI = mw.util.addPortletLink(
+ 'p-tb',
+ '#',
+ mw.msg( 'portlet-link-performance-inspector' )
+ );
-}() );
+ function activatePI() {
+ // Lets inspect the current page first, to make sure
the result isn't
+ // polluted by the modules in the performance inspector
+ mw.loader.using( [ 'mediawiki.inspect' ] ).done(
function () {
+
+ mw.libs.performanceInspector =
mw.libs.performanceInspector || {};
+ mw.libs.performanceInspector.inspect =
mw.libs.performanceInspector.inspect || {};
+ // lets collect the intresting stuff from
inspect
+ mw.libs.performanceInspector.inspect.modules =
mw.inspect.reports.size();
+ mw.libs.performanceInspector.inspect.css =
mw.inspect.reports.css();
+ mw.libs.performanceInspector.inspect.store =
mw.inspect.reports.store();
+ // store the results for each indvidual
inspection and a summary
+ // where we give an overview
+ mw.libs.performanceInspector.results = [];
+ mw.libs.performanceInspector.summary = [];
+
+ // in the future we maybe wanna do a couple of
async calls to
+ // collect the data and run the view when
everything is
+ // finished
+ $.when(
+ mw.loader.using( [
'ext.PerformanceInspector.analyze', 'ext.PerformanceInspector.view' ] ),
+ $.ready
+ ).done( function () {
+ mw.loader.using( [] ).done( function ()
{
+ var windowManager = new
OO.ui.WindowManager(),
+ piDialog = new
mw.libs.performanceInspector.PiDialog( {
+ size: 'larger'
+ } );
+ $( 'body' ).append(
windowManager.$element );
+ windowManager.addWindows( [
piDialog ] );
+ windowManager.openWindow(
piDialog );
+ } );
+ } );
+ } );
+ }
+
+ function onPIClick( e ) {
+ e.preventDefault();
+ activatePI();
+ }
+
+ $caPI = $( caPI );
+ $caPILink = $caPI.find( 'a' );
+
+ $caPI.on( 'click', onPIClick );
+ } );
+}( mediaWiki, jQuery ) );
diff --git a/modules/ext.PerformanceInspector.view.js
b/modules/ext.PerformanceInspector.view.js
new file mode 100644
index 0000000..b01c2fb
--- /dev/null
+++ b/modules/ext.PerformanceInspector.view.js
@@ -0,0 +1,88 @@
+/*jshint undef:false */
+( function ( mw, $ ) {
+
+ mw.libs.performanceInspector.PiDialog = function PiDialog( config ) {
+ mw.libs.performanceInspector.PiDialog.super.call( this, config
);
+ };
+
+ OO.inheritClass( mw.libs.performanceInspector.PiDialog,
OO.ui.ProcessDialog );
+
+ mw.libs.performanceInspector.PiDialog.static.title = OO.ui.deferMsg(
'performanceinspector-title' );
+
+ mw.libs.performanceInspector.PiDialog.static.actions = [ {
+ action: 'done',
+ label: 'Done',
+ flags: [ 'safe' ]
+ } ];
+
+ function PerformanceInspectorResult( name, config ) {
+ config = $.extend( {}, config );
+ PerformanceInspectorResult.parent.apply( this, arguments );
+ this.label = config.label;
+ this.icon = config.icon;
+ if ( this.$element.is( ':empty' ) ) {
+ this.$element.text( this.label );
+ }
+ }
+ OO.inheritClass( PerformanceInspectorResult, OO.ui.PageLayout );
+ PerformanceInspectorResult.prototype.setupOutlineItem = function (
outlineItem ) {
+
PerformanceInspectorResult.parent.prototype.setupOutlineItem.call( this,
outlineItem );
+ this.outlineItem
+ .setMovable( true )
+ .setRemovable( true )
+ .setIcon( this.icon )
+ .setLabel( this.label );
+ };
+
+ mw.libs.performanceInspector.PiDialog.prototype.initialize = function
() {
+ var self = this;
+
mw.libs.performanceInspector.PiDialog.parent.prototype.initialize.apply( this,
arguments );
+ this.bookletLayout = new OO.ui.BookletLayout( {
+ outlined: true,
+ continuous: true
+ } );
+
+ this.pages = [];
+
+ // TODO add info from mw.libs.performanceInspector.summary
+ this.pages.push( new PerformanceInspectorResult( mw.msg(
'performanceinspector-result-summary' ), {
+ label: mw.msg( 'performanceinspector-result-summary' ),
+ icon: mw.libs.performanceInspector.summary.length > 0 ?
'alert' : 'info',
+ content: [ $( '<h3>' ).text( mw.msg(
'performanceinspector-result-summary' ) ), '' ]
+ } ) );
+
+ mw.libs.performanceInspector.results.forEach( function ( result
) {
+ self.pages.push( new PerformanceInspectorResult(
result.name, {
+ label: result.label,
+ icon: result.icon || 'info',
+ content: [ $( '<h3>' ).text( result.name ),
result.result ]
+ } ) );
+ } );
+
+ this.bookletLayout.addPages( this.pages );
+ this.$body.append( this.bookletLayout.$element );
+ };
+
+ mw.libs.performanceInspector.PiDialog.prototype.getBodyHeight =
function () {
+ return 350;
+ };
+
+ mw.libs.performanceInspector.PiDialog.prototype.getActionProcess =
function ( action ) {
+ if ( action ) {
+ return new OO.ui.Process( function () {
+ this.close( {
+ action: action
+ } );
+ }, this );
+ }
+ return
mw.libs.performanceInspector.PiDialog.parent.prototype.getActionProcess.call(
this, action );
+ };
+
+ mw.libs.performanceInspector.PiDialog.prototype.getSetupProcess =
function ( data ) {
+ return
mw.libs.performanceInspector.PiDialog.parent.prototype.getSetupProcess.call(
this, data )
+ .next( function () {
+ this.bookletLayout.setPage( 'summary' );
+ }, this );
+ };
+
+}( mediaWiki, jQuery ) );
diff --git a/modules/info/ext.PerformanceInspector.backendtime.js
b/modules/info/ext.PerformanceInspector.backendtime.js
new file mode 100644
index 0000000..763c7e3
--- /dev/null
+++ b/modules/info/ext.PerformanceInspector.backendtime.js
@@ -0,0 +1,20 @@
+/*jshint undef:false */
+(function(mw, $) {
+
+function getMobileURL(url) {
+ return url;
+}
+
+var backendTime = window.performance.timing.responseStart -
window.performance.timing.navigationStart;
+
+if (backendTime > 300) {
+ mw.libs.performanceInspector.summary.push('The backend time is above
the medium time');
+}
+
+mw.libs.performanceInspector.results.push({
+ name: 'Backendtime',
+ label: 'Backendtime',
+ result: 'Time spent in backend ' + (window.performance.timing.responseStart
- window.performance.timing.navigationStart) + ' ms'
+});
+
+}(mediaWiki, jQuery));
diff --git a/modules/info/ext.PerformanceInspector.modules.js
b/modules/info/ext.PerformanceInspector.modules.js
new file mode 100644
index 0000000..8a5f4a0
--- /dev/null
+++ b/modules/info/ext.PerformanceInspector.modules.js
@@ -0,0 +1,24 @@
+/*jshint undef:false */
+( function ( mw, $ ) {
+var $result = $( '<table><thead><tr><th>' + 'Module name' +
'</th><th>Size</th></tr></thead>' );
+
+console.log( 'Modules' );
+
+mw.libs.performanceInspector.inspect.modules.forEach( function ( module ) {
+ $result.append( '<tr><td>' + module.name + '</td><td>' + module.size +
'</td></tr>' );
+} );
+
+
+var $cssresult = $( '<table><thead><tr><th>' + 'Module' +
'</th><th>allSelectors</th><th>matchedSelectors</th><th>percentMatched</th></tr></thead>'
);
+mw.libs.performanceInspector.inspect.css.forEach( function ( css ) {
+ $cssresult.append( '<tr><td>' + css.module + '</td><td>' +
css.allSelectors + '</td><td>' + css.matchedSelectors + '</td><td>' +
css.percentMatched + '</td></tr>' );
+} );
+
+
+mw.libs.performanceInspector.results.push( {
+ name: 'Module information',
+ label: 'Modules',
+ result: $result.append( $cssresult )
+} );
+
+}( mediaWiki, jQuery ) );
diff --git a/package.json b/package.json
index 54f4076..c48d197 100644
--- a/package.json
+++ b/package.json
@@ -4,10 +4,10 @@
},
"devDependencies": {
"grunt": "0.4.5",
+ "grunt-banana-checker": "^0.4.0",
"grunt-cli": "0.1.13",
- "grunt-contrib-jshint": "0.11.3",
- "grunt-banana-checker": "0.4.0",
- "grunt-jscs": "2.2.0",
- "grunt-jsonlint": "1.0.7"
+ "grunt-contrib-jshint": "^1.0.0",
+ "grunt-jscs": "^2.7.0",
+ "grunt-jsonlint": "^1.0.7"
}
}
--
To view, visit https://gerrit.wikimedia.org/r/271589
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I6d45a0b23045c3df14b0c0812edf6197437da4e6
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/PerformanceInspector
Gerrit-Branch: master
Gerrit-Owner: Phedenskog <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
