blob: 3f25ae43b5c1fcc00cfa1a42a7bd2c5ff76092f3 [file] [log] [blame]
/**
* Command line application to run Skottie-WASM perf on a Lottie file in the
* browser and then exporting the result.
*
*/
const puppeteer = require('puppeteer');
const express = require('express');
const fs = require('fs');
const commandLineArgs = require('command-line-args');
const commandLineUsage= require('command-line-usage');
const fetch = require('node-fetch');
const opts = [
{
name: 'canvaskit_js',
typeLabel: '{underline file}',
description: 'The path to canvaskit.js.'
},
{
name: 'canvaskit_wasm',
typeLabel: '{underline file}',
description: 'The path to canvaskit.wasm.'
},
{
name: 'input',
typeLabel: '{underline file}',
description: 'The Lottie JSON file to process.'
},
{
name: 'output',
typeLabel: '{underline file}',
description: 'The perf file to write. Defaults to perf.json',
},
{
name: 'use_gpu',
description: 'Whether we should run in non-headless mode with GPU.',
type: Boolean,
},
{
name: 'port',
description: 'The port number to use, defaults to 8081.',
type: Number,
},
{
name: 'help',
alias: 'h',
type: Boolean,
description: 'Print this usage guide.'
},
];
const usage = [
{
header: 'Skottie WASM Perf',
content: "Command line application to run Skottie-WASM perf."
},
{
header: 'Options',
optionList: opts,
},
];
// Parse and validate flags.
const options = commandLineArgs(opts);
if (!options.output) {
options.output = 'perf.json';
}
if (!options.port) {
options.port = 8081;
}
if (options.help) {
console.log(commandLineUsage(usage));
process.exit(0);
}
if (!options.canvaskit_js) {
console.error('You must supply path to canvaskit.js.');
console.log(commandLineUsage(usage));
process.exit(1);
}
if (!options.canvaskit_wasm) {
console.error('You must supply path to canvaskit.wasm.');
console.log(commandLineUsage(usage));
process.exit(1);
}
if (!options.input) {
console.error('You must supply a Lottie JSON filename.');
console.log(commandLineUsage(usage));
process.exit(1);
}
// Start up a web server to serve the three files we need.
let canvasKitJS = fs.readFileSync(options.canvaskit_js, 'utf8');
let canvasKitWASM = fs.readFileSync(options.canvaskit_wasm, 'binary');
let driverHTML = fs.readFileSync('skottie-wasm-perf.html', 'utf8');
let lottieJSON = fs.readFileSync(options.input, 'utf8');
const app = express();
app.get('/', (req, res) => res.send(driverHTML));
app.get('/res/canvaskit.wasm', function(req, res) {
res.type('application/wasm');
res.send(new Buffer(canvasKitWASM, 'binary'));
});
app.get('/res/canvaskit.js', (req, res) => res.send(canvasKitJS));
app.get('/res/lottie.json', (req, res) => res.send(lottieJSON));
app.listen(options.port, () => console.log('- Local web server started.'))
// Utility function.
async function wait(ms) {
await new Promise(resolve => setTimeout(() => resolve(), ms));
return ms;
}
const targetURL = "http://localhost:" + options.port + "/";
const viewPort = {width: 1000, height: 1000};
// Drive chrome to load the web page from the server we have running.
async function driveBrowser() {
console.log('- Launching chrome for ' + options.input);
let browser;
let page;
const headless = !options.use_gpu;
let browser_args = [
'--no-sandbox',
'--disable-setuid-sandbox',
'--window-size=' + viewPort.width + ',' + viewPort.height,
];
if (options.use_gpu) {
browser_args.push('--ignore-gpu-blacklist');
browser_args.push('--ignore-gpu-blocklist');
browser_args.push('--enable-gpu-rasterization');
}
console.log("Running with headless: " + headless + " args: " + browser_args);
try {
browser = await puppeteer.launch({headless: headless, args: browser_args});
page = await browser.newPage();
await page.setViewport(viewPort);
} catch (e) {
console.log('Could not open the browser.', e);
process.exit(1);
}
console.log("Loading " + targetURL);
try {
// Start trace.
await page.tracing.start({
path: options.output,
screenshots: false,
categories: ["blink", "cc", "gpu"]
});
await page.goto(targetURL, {
timeout: 60000,
waitUntil: 'networkidle0'
});
console.log('Waiting 60s for run to be done');
await page.waitForFunction('window._skottieDone === true', {
timeout: 60000,
});
// Stop Trace.
await page.tracing.stop();
} catch(e) {
console.log('Timed out while loading or drawing. Either the JSON file was ' +
'too big or hit a bug.', e);
await browser.close();
process.exit(1);
}
await browser.close();
// Need to call exit() because the web server is still running.
process.exit(0);
}
driveBrowser();