Initial commit

README.md

@@ -1,9 +1,7 @@
-# sitespeed.io plugin for GPSI (Google PageSpeed Insights)
-[![Build Status](https://travis-ci.org/sitespeedio/plugin-gpsi.svg?branch=master)](https://travis-ci.org/sitespeedio/plugin-gpsi)
+# sitespeed.io plugin for Lighthouse
+[![Build Status](https://travis-ci.org/sitespeedio/plugin-lighthouse.svg?branch=master)](https://travis-ci.org/sitespeedio/plugin-lighthouse)
 
-Run GPSI as a plugin for sitespeed.io
-
-Run by giving **--gpsi.key YOUR_GPSI_KEY** to sitespeed.io.
+Run Lighthouse as a plugin for sitespeed.io
 
 You can read more about sitespeed.io plugins [here](https://www.sitespeed.io/documentation/sitespeed.io/plugins/).
 
@@ -15,7 +13,7 @@ If you have checked out as the same level as sitespeed.io you run it like this (
 git clone https://github.com/sitespeedio/sitespeed.io.git
 cd sitespeed.io
 npm install
-bin/sitespeed.js --plugins.add ../plugin-gpsi/lib/ --gpsi.key YOUR_SECRET_KEY https://www.sitespeed.io/ -n 1
+bin/sitespeed.js --plugins.add ../plugin-lighthouse/lib/ https://www.sitespeed.io/ -n 1
 ```
 
 ## Run in production

lib/aggregator.js

@@ -0,0 +1,69 @@
+'use strict';
+
+const statsHelpers = require('../../lib/support/statsHelpers');
+const METRIC_NAMES = [
+  'critical-request-chains',
+  'first-meaningful-paint',
+  'speed-index-metric',
+  'estimated-input-latency',
+  'first-interactive',
+  'consistently-interactive'
+];
+
+function replaceAll(str, search, replacement) {
+  return str.replace(new RegExp(search, 'g'), replacement);
+}
+
+module.exports = {
+  stats: {},
+  groups: {},
+  addToAggregate(data, group) {
+    if (this.groups[group] === undefined) {
+      this.groups[group] = {};
+    }
+    let stats = this.stats;
+    let groups = this.groups;
+
+    METRIC_NAMES.forEach(function(metric) {
+      if (metric == 'critical-request-chains') {
+        statsHelpers.pushGroupStats(
+          stats,
+          groups[group],
+          metric,
+          parseInt(data[metric].displayValue)
+        );
+      } else {
+        statsHelpers.pushGroupStats(
+          stats,
+          groups[group],
+          metric,
+          parseInt(data[metric].rawValue)
+        );
+      }
+    });
+  },
+  summarize() {
+    if (
+      Object.keys(this.stats).length === 0 ||
+      Object.keys(this.groups).length === 0
+    )
+      return undefined;
+
+    const summary = {
+      groups: {}
+    };
+    const tmp = {};
+    for (let group of Object.keys(this.groups)) {
+      for (let stat of Object.keys(this.stats)) {
+        statsHelpers.setStatsSummary(
+          tmp,
+          replaceAll(stat, '-', ''),
+          this.stats[stat]
+        );
+      }
+      summary.groups[group] = tmp;
+    }
+
+    return summary;
+  }
+};

lib/index.js

@@ -2,29 +2,52 @@
 
 const fs = require('fs');
 const path = require('path');
-const analyzer = require('./analyzer');
+const lighthouse = require('lighthouse');
+const chromeLauncher = require('chrome-launcher');
+const filterRegistry = require('../../lib/support/filterRegistry');
+const aggregator = require('./aggregator');
 
-const DEFAULT_METRICS_PAGESUMMARY = ['ruleGroups.SPEED.score'];
+const DEFAULT_SUMMARY_METRICS = [
+  'criticalrequestchains',
+  'firstmeaningfulpaint',
+  'speedindexmetric',
+  'estimatedinputlatency',
+  'firstinteractive',
+  'consistentlyinteractive'
+];
+const PORT = '9222';
+const flags = {
+  port: PORT,
+  chromeFlags: [
+    `--remote-debugging-port=${PORT}`,
+    //‘--disable-web-security’,
+    //‘--disable-device-discovery-notifications’,
+    //‘--acceptSslCerts’,
+    '--no-sandbox',
+    //‘--ignore-certificate-errors’,
+    '--headless',
+    '--disable-gpu'
+  ]
+};
+
+function launchChromeAndRunLighthouse(url, flags = {}, config = null) {
+  return chromeLauncher.launch(flags).then(chrome => {
+    return lighthouse(url, flags, config).then(results =>
+      chrome.kill().then(() => results)
+    );
+  });
+}
 
 module.exports = {
   name() {
-    return 'gpsi';
+    return 'lighthouse';
   },
-  open(context, options) {
-    this.make = context.messageMaker('gpsi').make;
-
-    this.options = {
-      gpsi: options.gpsi,
-      mobile: options.mobile
-    };
-
-    // Register a logger for this plugin, a unique name so we can filter the log
-    this.log = context.intel.getLogger('sitespeedio.plugin.gpsi');
-
-    // Register which metrics we want to send to data storage
-    context.filterRegistry.registerFilterForType(
-      DEFAULT_METRICS_PAGESUMMARY,
-      'gpsi.pageSummary'
+  open(context) {
+    this.make = context.messageMaker('lighthouse').make;
+    this.log = context.intel.getLogger('sitespeedio.plugin.lighthouse');
+    filterRegistry.registerFilterForType(
+      DEFAULT_SUMMARY_METRICS,
+      'lighthouse.summary'
     );
 
     this.pug = fs.readFileSync(
@@ -35,37 +58,67 @@ module.exports = {
   processMessage(message, queue) {
     const make = this.make;
     const log = this.log;
+
     switch (message.type) {
       case 'sitespeedio.setup': {
-        // Tell the HTML plugin that this plugin got a pug of the type
-        // pageSummary = it will be shown on the page summary pahe
         queue.postMessage(
           make('html.pug', {
-            id: 'gpsi',
-            name: 'GPSI',
+            id: 'lighthouse',
+            name: 'Lighthouse',
             pug: this.pug,
             type: 'pageSummary'
           })
         );
         break;
       }
-
       case 'url': {
+        const config = {
+          passes: [
+            {
+              recordTrace: true,
+              pauseAfterLoadMs: 5250,
+              networkQuietThresholdMs: 5250,
+              cpuQuietThresholdMs: 5250,
+              useThrottling: true,
+              gatherers: []
+            }
+          ],
+          audits: [
+            'critical-request-chains',
+            'first-meaningful-paint',
+            'speed-index-metric',
+            'estimated-input-latency',
+            'first-interactive',
+            'consistently-interactive'
+          ]
+        };
         const url = message.url;
         const group = message.group;
-        return analyzer.analyzeUrl(url, log, this.options).then(result => {
-          log.info('Got ' + url + ' analysed from Google Page Speed Insights');
-          log.verbose('Result from Google Page Speed Insights:%:2j', result);
-          queue.postMessage(
-            // The HTML plugin will pickup every message names *.pageSummary
-            // and publish the data under pageInfo.data.*.pageSummary
-            // in this case pageInfo.data.gpsi.pageSummary
-            make('gpsi.pageSummary', result, {
-              url,
-              group
-            })
-          );
-        });
+        log.info('Collecting Lighthouse result');
+        return launchChromeAndRunLighthouse(url, flags, config)
+          .then(results => {
+            aggregator.addToAggregate(results.audits, group);
+            const summary = aggregator.summarize();
+            if (summary) {
+              for (let group of Object.keys(summary.groups)) {
+                queue.postMessage(
+                  make('lighthouse.pageSummary', summary.groups[group], {
+                    url,
+                    group
+                  })
+                );
+              }
+            }
+            log.info('Finished collecting Lighthouse result');
+          })
+          .catch(err => {
+            log.error('Error creating Lighthouse result ', err);
+            queue.postMessage(
+              make('error', err, {
+                url
+              })
+            );
+          });
       }
     }
   }

lib/pug/index.pug

@@ -5,72 +5,17 @@ mixin sizeCell(title, size)
   td.number(data-title=title, data-value= size)= h.size.format(size)
 
 a
-h2 Google Page Speed Insights
+h2 Lighthouse
 
-- var gpsiSummary = pageInfo.data.gpsi.pageSummary
-
-h3 Page metrics
-.row
-  .one-half.column
-    table
-      thead
-        tr
-          th(colspan='2') Resources
-        tr
-          td Requests
-          +numberCell('', gpsiSummary.pageStats.numberResources)
-        tr
-          td Static Requests
-          +numberCell('', gpsiSummary.pageStats.numberStaticResources)
-        tr
-          td CSS Requests
-          +numberCell('', gpsiSummary.pageStats.numberCssResources)
-        tr
-          td JavaScript Requests
-          +numberCell('', gpsiSummary.pageStats.numberJsResources)
-        tr
-          td Hosts
-          +numberCell('', gpsiSummary.pageStats.numberHosts)
-  .one-half.column
-    table
-      thead
-        tr
-          th(colspan='2') Sizes
-        tr
-          td Total request size
-          +sizeCell('', gpsiSummary.pageStats.totalRequestBytes)
-        tr
-          td HTML size
-          +sizeCell('', gpsiSummary.pageStats.htmlResponseBytes)
-        tr
-          td Images size
-          +sizeCell('', gpsiSummary.pageStats.imageResponseBytes)
-        tr
-          td CSS size
-          +sizeCell('', gpsiSummary.pageStats.cssResponseBytes)
-        tr
-          td JavaScript size
-          +sizeCell('', gpsiSummary.pageStats.javascriptResponseBytes)
-        tr
-          td Others size
-          +sizeCell('', gpsiSummary.pageStats.otherResponseBytes)
-
-h3 Total performance score #{gpsiSummary.ruleGroups.SPEED.score}
+- var lighthouseSummary = pageInfo.data.lighthouse.pageSummary
 
+h3 Performance metrics
 .responsive
   table
     thead
       tr
-        th Rule name
-        th Summary
-        th Impact
-    tbody
-    each rule, name in gpsiSummary.formattedResults.ruleResults
-      if (rule.ruleImpact > 0)
+        th(colspan='2') Resources
+      each metric,metric_name in lighthouseSummary
         tr
-          td(data-title='Name') #{rule.localizedRuleName}
-          if rule.summary
-            td.url(data-title='Summary') #{rule.summary.format}
-          else
-            td.url(data-title='Summary') No summary.
-          td(data-title='Impact')  #{rule.ruleImpact}
+          td #{metric_name}
+          +numberCell('', metric.median)