Skip to content

denar90/psi-ngrok

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

psi-ngrok Build Status

PageSpeed Insights with local project

Uses psi and ngrok for running PageSpeed Insights for locally run web application.

Inspired by

Install

$ npm install --save-dev psi-ngrok 

Usage

const psiNgrok = require('psi-ngrok'); psiNgrok();

Usage with configuration

const psiNgrok = require('psi-ngrok'); const config = { pages: ['page1.html', 'page2.html'], onBeforeConnect: function() { // do somtheng before ngrok is connected to your host }, //called if page passed `threshold` limit onSuccess: function(data) { console.log(data); // all PSI data about page }, //called if page didn't pass `threshold` limit onError: function(error) { console.log(error); // error message }, options: { threshold: 85 } }; psiNgrok(config);

Also look at recipes.

Usage with Grunt

Here example of using psi-ngrok with grunt-connect

var psiNgrok = require('psi-ngrok'); module.exports = function(grunt) { grunt.initConfig({ connect: { server: { options: { port: 8000, base: 'public' } } }, }); grunt.loadNpmTasks('grunt-contrib-connect'); grunt.registerTask('pagespeed', function() { var async = this.async; grunt.event.once('connect.server.listening', function(host, port) { psiNgrok({ port: port, pages: ['index.html', 'slow.html'], onError: function(error) { grunt.fatal(error); }, options: { threshold: 80 } }).then(async()); }); }); grunt.registerTask('default', ['pagespeed', 'connect:server:keepalive']); };

Want to test it?

Run

  • git clone https://github.com/denar90/psi-ngrok && cd psi-ngrok && npm i
  • npm run grunt-example

Usage with Gulp

Here example of using psi-ngrok with gulp-connect

var gulp = require('gulp'); var connect = require('gulp-connect'); var psiNgrok = require('psi-ngrok'); var port = 8000; var connectServer = function() { return connect.server({ root: 'public', port: port }); }; function handleError(err) { console.log(err.toString()); process.exit(-1); } gulp.task('pagespeed', function () { psiNgrok({ pages: ['index.html', 'slow.html'], port: port, onBeforeConnect: connectServer, onError: handleError, options: { threshold: 80 } }); }); gulp.task('default', ['pagespeed']);

Want to test it?

Run

  • git clone https://github.com/denar90/psi-ngrok && cd psi-ngrok && npm i
  • npm run gulp-example

API

psiNgrok([config])

Returns a promise for the response data from Google PageSpeed Insights for pages run locally.

config

Type: object

strategies

Type: array
Default: ['mobile', 'desktop']
Values: mobile, desktop

Strategies to use when analyzing the page.

pages

Type: array
Default: ['/']

List of local pages which will be analyzed.

port

Type: number
Default: 8000

Port local server running at.

onBeforeConnect

Type: function
Default: Function.prototype

Function called before ngrok is started.

Useful for running local server.

onSuccess

Type: function
Default: Function.prototype

Function called each time page(s) passed threshold limit. Has data argument which consist of all PSI data about page.

onError

Type: function
Default: Function.prototype

Function called each time page(s) didn't pass threshold limit. Has error argument - message about what went wrong.

options

Type: object

Pretty the same as psi options

key

Type: string
Default: Free tier

When using this module for a production-level build process, registering for an API key from the Google Developer Console is recommended.

locale

Type: string
Default: en_US

Locale results should be generated in.

threshold

Type: number
Default: 70

Threshold score to pass the PageSpeed test. Useful for setting a performance budget.

MIT © Artem Denysov

About

PageSpeed Insights with local server

Topics

Resources

License

Stars

Watchers

Forks

Packages

 
 
 

Contributors