diff --git a/benchmark-internal/README.md b/benchmark-internal/README.md new file mode 100644 index 0000000..2a66721 --- /dev/null +++ b/benchmark-internal/README.md @@ -0,0 +1 @@ +# `observable-prerender` Internal Benchmarks diff --git a/benchmark-internal/basics.md b/benchmark-internal/basics.md new file mode 100644 index 0000000..71c9077 --- /dev/null +++ b/benchmark-internal/basics.md @@ -0,0 +1,8 @@ +| Command | Mean [s] | Min [s] | Max [s] | Relative | +|:---|---:|---:|---:|---:| +| `observable-prerender @d3/bar-chart chart -o ./out/bar-chart.svg` | 1.251 ± 0.432 | 1.055 | 2.472 | 1.00 | +| `observable-prerender @d3/bar-chart chart -o ./out/bar-chart.png` | 1.354 ± 0.036 | 1.311 | 1.424 | 1.08 ± 0.37 | +| `observable-prerender @d3/bivariate-choropleth chart -o ./out/choropleth-chart.svg` | 1.479 ± 0.244 | 1.354 | 2.168 | 1.18 ± 0.45 | +| `observable-prerender @d3/bivariate-choropleth chart -o ./out/choropleth-chart.png` | 1.591 ± 0.048 | 1.534 | 1.695 | 1.27 ± 0.44 | +| `observable-prerender @asg017/covid19-cases-in-whittier-california chart -o ./out/whittier-chart.svg` | 2.139 ± 0.953 | 1.735 | 4.840 | 1.71 ± 0.96 | +| `observable-prerender @asg017/covid19-cases-in-whittier-california chart -o ./out/whittier-chart.png` | 2.595 ± 0.620 | 2.015 | 3.844 | 2.07 ± 0.87 | diff --git a/benchmark-internal/benchmark-internal.sh b/benchmark-internal/benchmark-internal.sh new file mode 100755 index 0000000..e6f3ecb --- /dev/null +++ b/benchmark-internal/benchmark-internal.sh @@ -0,0 +1,57 @@ +#!/bin/bash +BASEDIR=$(dirname "$0") +OUTDIR="$BASEDIR/out" + +PATH="$PATH:$BASEDIR/../bin" + +mkdir -p $OUTDIR + +bm_basic () { + hyperfine --export-markdown basics.md \ + "observable-prerender @d3/bar-chart chart -o $OUTDIR/bar-chart.svg" \ + "observable-prerender @d3/bar-chart chart -o $OUTDIR/bar-chart.png" \ + "observable-prerender @d3/bivariate-choropleth chart -o $OUTDIR/choropleth-chart.svg" \ + "observable-prerender @d3/bivariate-choropleth chart -o $OUTDIR/choropleth-chart.png" \ + "observable-prerender @asg017/covid19-cases-in-whittier-california chart -o $OUTDIR/whittier-chart.svg" \ + "observable-prerender @asg017/covid19-cases-in-whittier-california chart -o $OUTDIR/whittier-chart.png" +} + +bm_format() { + hyperfine --export-markdown format.md \ + "observable-prerender @d3/bar-chart chart -o $OUTDIR/bar-chart.svg" \ + "observable-prerender @d3/bar-chart chart -o $OUTDIR/bar-chart.png" \ + "observable-prerender @d3/bar-chart chart -o $OUTDIR/bar-chart.jpeg" \ + "observable-prerender @d3/bar-chart chart -o $OUTDIR/bar-chart.html" +} + +bm_browser() { + node start-headed-browser.js > headed_ws.tmp & + HEADED_PID=$! + sleep 3 + HEADED_WS=$(cat headed_ws.tmp) + + node start-headless-browser.js > headless_ws.tmp & + HEADLESS_PID=$! + sleep 3 + HEADLESS_WS=$(cat headless_ws.tmp) + + echo $HEADED_PID $HEADED_WS + echo $HEADLESS_PID $HEADLESS_WS + echo $OUTDIR + hyperfine --export-markdown browser.md \ + "../bin/observable-prerender @d3/bar-chart chart -o -" \ + "../bin/observable-prerender @d3/bar-chart chart -o - --browser-wsendpoint $HEADED_WS" \ + "../bin/observable-prerender @d3/bar-chart chart -o - --browser-wsendpoint $HEADLESS_WS" + + kill $HEADED_PID $HEADLESS_PID + + rm headed_ws.tmp headless_ws.tmp +} + +bm() { + bm_basic + bm_format + bm_browser +} + +bm \ No newline at end of file diff --git a/benchmark-internal/browser.md b/benchmark-internal/browser.md new file mode 100644 index 0000000..35bc879 --- /dev/null +++ b/benchmark-internal/browser.md @@ -0,0 +1,5 @@ +| Command | Mean [s] | Min [s] | Max [s] | Relative | +|:---|---:|---:|---:|---:| +| `../bin/observable-prerender @d3/bar-chart chart -o -` | 1.367 ± 0.445 | 1.065 | 2.235 | 3.94 ± 2.64 | +| `../bin/observable-prerender @d3/bar-chart chart -o - --browser-wsendpoint ws://127.0.0.1:53496/devtools/browser/d88565c0-23f7-40bd-88c5-817bbe4e57f0` | 0.993 ± 0.051 | 0.941 | 1.124 | 2.86 ± 1.68 | +| `../bin/observable-prerender @d3/bar-chart chart -o - --browser-wsendpoint ws://127.0.0.1:53518/devtools/browser/ff52357a-44e2-4fbc-b25d-be61bc46cf11` | 0.347 ± 0.204 | 0.251 | 0.923 | 1.00 | diff --git a/benchmark-internal/format.md b/benchmark-internal/format.md new file mode 100644 index 0000000..88f6c57 --- /dev/null +++ b/benchmark-internal/format.md @@ -0,0 +1,6 @@ +| Command | Mean [s] | Min [s] | Max [s] | Relative | +|:---|---:|---:|---:|---:| +| `observable-prerender @d3/bar-chart chart -o ./out/bar-chart.svg` | 1.321 ± 0.452 | 1.062 | 2.318 | 1.00 | +| `observable-prerender @d3/bar-chart chart -o ./out/bar-chart.png` | 1.359 ± 0.024 | 1.334 | 1.402 | 1.03 ± 0.35 | +| `observable-prerender @d3/bar-chart chart -o ./out/bar-chart.jpeg` | 1.462 ± 0.195 | 1.273 | 1.813 | 1.11 ± 0.41 | +| `observable-prerender @d3/bar-chart chart -o ./out/bar-chart.html` | 1.350 ± 0.344 | 1.120 | 2.253 | 1.02 ± 0.44 | diff --git a/benchmark-internal/start-headed-browser.js b/benchmark-internal/start-headed-browser.js new file mode 100644 index 0000000..374722d --- /dev/null +++ b/benchmark-internal/start-headed-browser.js @@ -0,0 +1,6 @@ +const puppeteer = require("puppeteer"); +async function main() { + const browser = await puppeteer.launch({ headless: false }); + console.log(browser.wsEndpoint()); +} +main(); diff --git a/benchmark-internal/start-headless-browser.js b/benchmark-internal/start-headless-browser.js new file mode 100644 index 0000000..5896d6f --- /dev/null +++ b/benchmark-internal/start-headless-browser.js @@ -0,0 +1,6 @@ +const puppeteer = require("puppeteer"); +async function main() { + const browser = await puppeteer.launch({ headless: true }); + console.log(browser.wsEndpoint()); +} +main(); diff --git a/bin/observable-prerender-animate b/bin/observable-prerender-animate index 5c35a47..ed00d1d 100755 --- a/bin/observable-prerender-animate +++ b/bin/observable-prerender-animate @@ -1,7 +1,12 @@ #!/usr/bin/env node const { program } = require("commander"); const { load } = require("../src"); -const { applyBrowserOptions, applyRedefineOptions } = require("./utils.js"); +const { + applyBrowserOptions, + applyRedefineOptions, + getNotebookConfig, + runRedefines, +} = require("./utils.js"); const { join } = require("path"); function parseArgIter(iter) { diff --git a/bin/observable-prerender-open b/bin/observable-prerender-open index 79b20db..7f3f00e 100755 --- a/bin/observable-prerender-open +++ b/bin/observable-prerender-open @@ -25,6 +25,7 @@ p.action(async function (argNotebook, argCells) { await runRedefines(notebook, opts, true); console.log(`Notebook ${argNotebook} loaded.`); console.log(notebook.browser.wsEndpoint()); + process.on("exit", () => notebook.close()); }) .catch((error) => { console.error(`Error caught when loading ${argNotebook} with`, argCells); diff --git a/bin/utils.js b/bin/utils.js index abde55e..a7a0ba7 100644 --- a/bin/utils.js +++ b/bin/utils.js @@ -114,7 +114,7 @@ function getNotebookConfig(opts) { width, height, headless, - browserWsendpoint, + browserWSEndpoint: browserWsendpoint, }; if (token) config["OBSERVABLEHQ_API_KEY"] = token; diff --git a/package.json b/package.json index 5e1e1d5..9293864 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@alex.garcia/observable-prerender", - "version": "0.4.0", + "version": "0.4.3", "description": "Pre-render and programmatically control Observable notebooks with Puppeteer!", "main": "src/index.js", "author": "Alex Garcia ", diff --git a/src/index.js b/src/index.js index 494bb0e..63efbf9 100644 --- a/src/index.js +++ b/src/index.js @@ -245,11 +245,11 @@ async function load(notebook, targets = [], config = {}) { let launchedBrowser = false; if (!browser) { if (page) browser = page.browser(); - else if (browserWSEndpoint) + else if (browserWSEndpoint) { browser = await puppeteer.connect({ browserWSEndpoint, }); - else { + } else { browser = await puppeteer.launch({ defaultViewport: { width, height }, args: [`--window-size=${width},${height}`],