first cut bench/

- use karma-benchmark framework which uses benchmark.js under the hood to run the benchmarks - use karma-benchmark-json-reporter to output benchmark result to JSON file checked in to dist/ (good idea?) - use karma-benchmarkjs-reporter to output log to stdout during runs - add a few suites (more to come)
plotly · etpinard · Mar 23, 2017 · Feb 22, 2018 · Feb 22, 2018 · Feb 22, 2018
commit 5c6654b084bb3155b77d655ac3ae1a079216407f
diff --git a/bench/.eslintrc b/bench/.eslintrc
@@ -0,0 +1,11 @@
+{
+  "extends": "../.eslintrc",
+  "env": {
+    "browser": true
+  },
+  "globals": {
+    "suite": true,
+    "benchmark": true,
+    "Plotly": true
+  }
+}
diff --git a/bench/karma.conf.js b/bench/karma.conf.js
@@ -0,0 +1,82 @@
+/* eslint-env node*/
+
+var pkg = require('../package.json');
+var execSync = require('child_process').execSync;
+
+func.defaultConfig = {
+
+    // base path that will be used to resolve all patterns (eg. files, exclude)
+    basePath: '.',
+
+    // frameworks to use
+    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
+    frameworks: ['browserify', 'benchmark'],
+    reporters: ['benchmark', 'benchmark-json'],
+
+    // list of files / patterns to load in the browser
+    files: [
+        '../build/plotly.js',
+        './suites/*_bench.js'
+    ],
+
+    preprocessors: {
+        './suites/*_bench.js': ['browserify']
+    },
+
+    browserify: {
+        transform: ['../tasks/util/shortcut_paths.js'],
+        extensions: ['.js'],
+        debug: true
+    },
+
+    benchmarkJsonReporter: {
+        pathToJson: '../dist/benchmarks.json',
+        formatOutput: function(results) {
+            return {
+                meta: {
+                    version: pkg.version,
+                    commit: execSync('git rev-parse HEAD').toString().replace('\n', ''),
+                    date: (new Date()).toTimeString()
+                },
+                results: results
+            };
+        }
+    },
+
+    // web server port
+    port: 9876,
+
+    // enable / disable colors in the output (reporters and logs)
+    colors: true,
+
+    // enable / disable watching file and executing tests whenever any file changes
+    autoWatch: false,
+
+    // if true, Karma captures browsers, runs the tests and exits
+    singleRun: true,
+
+    // how long will Karma wait for a message from a browser before disconnecting (30 ms)
+    browserNoActivityTimeout: 30000,
+
+    // start these browsers
+    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
+    browsers: ['Chrome_WindowSized'],
+
+    // custom browser options
+    //
+    // window-size values came from observing default size
+    //
+    // '--ignore-gpu-blacklist' allow to test WebGL on CI (!!!)
+    customLaunchers: {
+        Chrome_WindowSized: {
+            base: 'Chrome',
+            flags: ['--window-size=1035,617', '--ignore-gpu-blacklist']
+        },
+        Firefox_WindowSized: {
+            base: 'Firefox',
+            flags: ['--width=1035', '--height=617']
+        }
+    }
+};
+
+module.exports = func;
diff --git a/bench/suites/lib_bench.js b/bench/suites/lib_bench.js
@@ -0,0 +1,16 @@
+var Lib = require('@src/lib');
+
+suite('Benchmark: lib functions', function() {
+
+    benchmark('Lib.cleanNumber', function() {
+        [
+            0, 1, 2, 1234.567,
+            -1, -100, -999.999,
+            Number.MAX_VALUE, Number.MIN_VALUE, Number.EPSILON,
+            -Number.MAX_VALUE, -Number.MIN_VALUE, -Number.EPSILON,
+            NaN, Infinity, -Infinity, null, undefined, new Date(), '',
+            ' ', '\t', '2\t2', '2%2', '2$2', {1: 2}, [1], ['1'], {}, []
+        ]
+        .forEach(Lib.cleanNumber);
+    });
+});
diff --git a/bench/suites/plot_big_data_bench.js b/bench/suites/plot_big_data_bench.js
@@ -0,0 +1,36 @@
+var suiteOpts = {
+    defer: true
+};
+
+var benchmarkOpts = {
+    setup: function() {
+        this.gd = document.createElement('div');
+        document.body.appendChild(this.gd);
+    },
+    teardown: function() {
+        Plotly.purge(this.gd);
+        document.body.removeChild(this.gd);
+    }
+};
+
+suite('Benchmark: plotting large data', function() {
+    var N = 1e5;
+
+    var trace = {
+        type: 'scattergl',
+        x: new Array(N),
+        y: new Array(N)
+    };
+
+    for(var i = 0; i < N; i++) {
+        trace.x[i] = Math.random();
+        trace.y[i] = Math.random();
+    }
+
+    benchmark('scattergl 1e5 pts', function(deferred) {
+        Plotly.plot(this.gd, [trace]).then(function() {
+            deferred.resolve();
+        });
+    }, benchmarkOpts);
+
+}, suiteOpts);
diff --git a/bench/suites/plot_mock_bench.js b/bench/suites/plot_mock_bench.js
@@ -0,0 +1,35 @@
+var suiteOpts = {
+    defer: true
+};
+
+var benchmarkOpts = {
+    setup: function() {
+        this.gd = document.createElement('div');
+        document.body.appendChild(this.gd);
+    },
+
+    teardown: function() {
+        Plotly.purge(this.gd);
+        document.body.removeChild(this.gd);
+    }
+};
+
+suite('Benchmark: plotting image mocks', function() {
+
+    benchmark('17.json', function(deferred) {
+        var mock = require('@mocks/17.json');
+
+        Plotly.plot(this.gd, mock).then(function() {
+            deferred.resolve();
+        });
+    }, benchmarkOpts);
+
+    benchmark('contour_match_edges', function(deferred) {
+        var mock = require('@mocks/contour_match_edges.json');
+
+        Plotly.plot(this.gd, mock).then(function() {
+            deferred.resolve();
+        });
+    }, benchmarkOpts);
+
+}, suiteOpts);
diff --git a/dist/benchmarks.json b/dist/benchmarks.json
@@ -0,0 +1,172 @@
+{
+  "meta": {
+    "version": "1.24.2",
+    "commit": "87fda71a4e16f544dca19ae63c53aef3f87e7c3f\n",
+    "date": "17:24:16 GMT-0400 (EDT)"
+  },
+  "results": [
+    {
+      "fullName": "Benchmark: lib function--Lib.cleanNumber-Chrome 57.0.2987 (Linux 0.0.0)",
+      "browser": "Chrome 57.0.2987 (Linux 0.0.0)",
+      "suite": "Benchmark: lib functions",
+      "name": "Lib.cleanNumber",
+      "count": 29676,
+      "cycles": 4,
+      "hz": 384570.19438444916,
+      "hzDeviation": 17008.634032458256,
+      "mean": 0.0000026003055218582925,
+      "deviation": 1.364101677043473e-7,
+      "variance": 1.8607733853128157e-14,
+      "moe": 3.29102246178391e-8,
+      "rme": 1.2656291478518267,
+      "sem": 1.679093092746893e-8,
+      "sample": [
+        0.00000266208383879229,
+        0.0000027968728939210137,
+        0.000002763175630138833,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025272947836635666,
+        0.0000025272947836635666,
+        0.000002628386575010109,
+        0.0000025272947836635666,
+        0.0000025946893112279283,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.000002628386575010109,
+        0.00000266208383879229,
+        0.0000025609920474457475,
+        0.0000025272947836635666,
+        0.0000025272947836635666,
+        0.0000025272947836635666,
+        0.000002628386575010109,
+        0.0000025609920474457475,
+        0.0000025946893112279283,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025946893112279283,
+        0.0000025272947836635666,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.000003571909960911174,
+        0.0000025272947836635666,
+        0.000002763175630138833,
+        0.0000025609920474457475,
+        0.00000266208383879229,
+        0.0000025946893112279283,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025272947836635666,
+        0.0000025609920474457475,
+        0.000002729478366356652,
+        0.0000025946893112279283,
+        0.000002628386575010109,
+        0.0000025609920474457475,
+        0.0000025272947836635666,
+        0.0000025609920474457475,
+        0.0000025272947836635666,
+        0.000002628386575010109,
+        0.0000025272947836635666,
+        0.0000025609920474457475,
+        0.0000025946893112279283,
+        0.000002695781102574471,
+        0.0000025946893112279283,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025272947836635666,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025609920474457475,
+        0.0000025946893112279283,
+        0.000002729478366356652
+      ]
+    },
+    {
+      "fullName": "Benchmark: plotting image mock--17.j-on-Chrome 57.0.2987 (Linux 0.0.0)",
+      "browser": "Chrome 57.0.2987 (Linux 0.0.0)",
+      "suite": "Benchmark: plotting image mocks",
+      "name": "17.json",
+      "count": 2,
+      "cycles": 2,
+      "hz": 3.2833983172583627,
+      "hzDeviation": 6.586365198789878,
+      "mean": 0.30456249999999996,
+      "deviation": 0.3768417096171055,
+      "variance": 0.14200967410714288,
+      "moe": 0.31509761571970124,
+      "rme": 103.45909812261893,
+      "sem": 0.13323366415209353,
+      "sample": [
+        0.056,
+        0.0605,
+        0.0915,
+        0.1035,
+        0.1735,
+        0.278,
+        0.5185,
+        1.155
+      ]
+    },
+    {
+      "fullName": "Benchmark: plotting image mock--contour_match_edge--Chrome 57.0.2987 (Linux 0.0.0)",
+      "browser": "Chrome 57.0.2987 (Linux 0.0.0)",
+      "suite": "Benchmark: plotting image mocks",
+      "name": "contour_match_edges",
+      "count": 2,
+      "cycles": 2,
+      "hz": 2.202989771833202,
+      "hzDeviation": 5.00452373940872,
+      "mean": 0.45392857142857146,
+      "deviation": 0.519817229784616,
+      "variance": 0.2702099523809523,
+      "moe": 0.48076807368986396,
+      "rme": 105.91271489627215,
+      "sem": 0.19647244531665875,
+      "sample": [
+        0.083,
+        0.0825,
+        0.1245,
+        0.206,
+        0.445,
+        0.7355,
+        1.501
+      ]
+    },
+    {
+      "fullName": "Benchmark: plotting large data--cattergl 1e5 pt--Chrome 57.0.2987 (Linux 0.0.0)",
+      "browser": "Chrome 57.0.2987 (Linux 0.0.0)",
+      "suite": "Benchmark: plotting large data",
+      "name": "scattergl 1e5 pts",
+      "count": 1,
+      "cycles": 1,
+      "hz": 1.4579384749963553,
+      "hzDeviation": 0.8757783387450939,
+      "mean": 0.6859,
+      "deviation": 0.24255604163436814,
+      "variance": 0.05883343333333334,
+      "moe": 0.17350208461698663,
+      "rme": 25.29553646551781,
+      "sem": 0.07670295517992336,
+      "sample": [
+        0.809,
+        0.796,
+        0.814,
+        0.329,
+        0.813,
+        0.85,
+        0.339,
+        0.346,
+        0.92,
+        0.843
+      ]
+    }
+  ]
+}
diff --git a/package.json b/package.json
@@ -44,6 +44,7 @@
     "start-image_viewer": "node devtools/image_viewer/server.js",
     "start": "npm run start-test_dashboard",
     "baseline": "node tasks/baseline.js",
+    "bench": "karma start bench/karma.conf.js",
     "preversion": "npm-link-check && npm dedupe && npm ls",
     "version": "npm run build && git add -A dist src build",
     "postversion": "node -e \"console.log('Version bumped and committed. If ok, run: git push && git push --tags')\""
@@ -115,6 +116,9 @@
     "image-size": "^0.5.1",
     "jasmine-core": "^2.4.1",
     "karma": "^1.5.0",
+    "karma-benchmark": "^0.7.1",
+    "karma-benchmark-json-reporter": "^0.1.0",
+    "karma-benchmarkjs-reporter": "^1.0.0",
     "karma-browserify": "^5.1.1",
     "karma-chrome-launcher": "^2.0.0",
     "karma-coverage": "^1.0.0",