2020-01-09 06:40:04 -05:00
|
|
|
const chartjs = require('chartjs-node');
|
2020-01-18 09:14:30 -05:00
|
|
|
const results = require('./results');
|
2020-01-09 06:40:04 -05:00
|
|
|
|
|
|
|
const colours = {
|
|
|
|
'hyperbuild': '#041f60',
|
2020-01-12 01:39:23 -05:00
|
|
|
'hyperbuild-nodejs': '#1f77b4',
|
|
|
|
'minimize': '#ff7f0e',
|
|
|
|
'html-minifier': '#2ca02c',
|
2020-01-09 06:40:04 -05:00
|
|
|
};
|
|
|
|
|
|
|
|
const chartOptions = (title, displayLegend, yTick = t => t) => ({
|
|
|
|
options: {
|
|
|
|
title: {
|
|
|
|
display: true,
|
|
|
|
text: title,
|
2020-01-12 01:39:23 -05:00
|
|
|
fontColor: '#333',
|
2020-01-12 04:32:37 -05:00
|
|
|
fontSize: 24,
|
2020-01-09 06:40:04 -05:00
|
|
|
},
|
|
|
|
scales: {
|
|
|
|
xAxes: [{
|
2020-01-14 05:30:44 -05:00
|
|
|
barPercentage: 0.25,
|
2020-01-09 06:40:04 -05:00
|
|
|
gridLines: {
|
2020-01-12 01:39:23 -05:00
|
|
|
color: '#e2e2e2',
|
2020-01-09 06:40:04 -05:00
|
|
|
},
|
|
|
|
ticks: {
|
2020-01-12 01:39:23 -05:00
|
|
|
fontColor: '#666',
|
2020-01-12 04:32:37 -05:00
|
|
|
fontSize: 20,
|
2020-01-09 06:40:04 -05:00
|
|
|
},
|
|
|
|
}],
|
|
|
|
yAxes: [{
|
|
|
|
gridLines: {
|
2020-01-12 01:39:23 -05:00
|
|
|
color: '#ccc',
|
2020-01-09 06:40:04 -05:00
|
|
|
},
|
|
|
|
ticks: {
|
|
|
|
callback: yTick,
|
2020-01-12 01:39:23 -05:00
|
|
|
fontColor: '#666',
|
2020-01-12 04:32:37 -05:00
|
|
|
fontSize: 20,
|
2020-01-09 06:40:04 -05:00
|
|
|
},
|
|
|
|
}],
|
|
|
|
},
|
|
|
|
legend: {
|
|
|
|
display: displayLegend,
|
|
|
|
labels: {
|
|
|
|
fontColor: '#000',
|
|
|
|
},
|
|
|
|
},
|
|
|
|
},
|
|
|
|
});
|
|
|
|
|
2020-01-18 09:14:30 -05:00
|
|
|
const renderChart = async (cfg) => {
|
2020-01-12 04:32:37 -05:00
|
|
|
const chart = new chartjs(900, 650);
|
2020-01-09 06:40:04 -05:00
|
|
|
await chart.drawChart(cfg);
|
2020-01-18 09:14:30 -05:00
|
|
|
return chart.getImageBuffer('image/png');
|
2020-01-09 06:40:04 -05:00
|
|
|
};
|
|
|
|
|
|
|
|
(async () => {
|
2020-01-18 09:14:30 -05:00
|
|
|
const averageSpeeds = results.getSpeedResults().getAverageRelativeSpeedPerMinifier('hyperbuild-nodejs');
|
|
|
|
results.writeAverageSpeedsGraph(await renderChart({
|
2020-01-09 06:40:04 -05:00
|
|
|
type: 'bar',
|
|
|
|
data: {
|
2020-01-18 09:14:30 -05:00
|
|
|
labels: averageSpeeds.map(([n]) => n),
|
2020-01-12 01:39:23 -05:00
|
|
|
datasets: [{
|
|
|
|
label: 'Average relative OP/s',
|
2020-01-12 01:48:00 -05:00
|
|
|
backgroundColor: '#1f77b4',
|
2020-01-18 09:14:30 -05:00
|
|
|
data: averageSpeeds.map(([_, v]) => v),
|
2020-01-12 01:39:23 -05:00
|
|
|
}],
|
2020-01-09 06:40:04 -05:00
|
|
|
},
|
2020-01-12 01:39:23 -05:00
|
|
|
...chartOptions('Average operations per second (higher is better)', false, tick => `${tick * 100}%`),
|
2020-01-18 09:14:30 -05:00
|
|
|
}));
|
|
|
|
|
|
|
|
const speeds = results.getSpeedResults().getRelativeFileSpeedsPerMinifier('hyperbuild-nodejs');
|
|
|
|
results.writeSpeedsGraph(await renderChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
labels: speeds[0][1].map(([n]) => n),
|
|
|
|
datasets: speeds.map(([minifier, fileSpeeds]) => ({
|
|
|
|
label: minifier,
|
|
|
|
backgroundColor: colours[minifier],
|
|
|
|
data: fileSpeeds.map(([_, speed]) => speed),
|
|
|
|
})),
|
|
|
|
},
|
|
|
|
...chartOptions('Operations per second (higher is better)', true, tick => `${tick * 100}%`),
|
|
|
|
}));
|
2020-01-09 06:40:04 -05:00
|
|
|
|
2020-01-18 09:14:30 -05:00
|
|
|
const averageSizes = results.getSizeResults().getAverageRelativeSizePerMinifier();
|
|
|
|
results.writeAverageSizesGraph(await renderChart({
|
2020-01-09 06:40:04 -05:00
|
|
|
type: 'bar',
|
|
|
|
scaleFontColor: 'red',
|
|
|
|
data: {
|
2020-01-18 09:14:30 -05:00
|
|
|
labels: averageSizes.map(([n]) => n),
|
2020-01-12 01:39:23 -05:00
|
|
|
datasets: [{
|
|
|
|
label: 'Average minified size',
|
2020-01-12 01:48:00 -05:00
|
|
|
backgroundColor: '#2ca02c',
|
2020-01-18 09:14:30 -05:00
|
|
|
data: averageSizes.map(([_, v]) => v),
|
2020-01-12 01:39:23 -05:00
|
|
|
}],
|
2020-01-09 06:40:04 -05:00
|
|
|
},
|
2020-01-12 01:39:23 -05:00
|
|
|
...chartOptions('Average minified size (lower is better)', false, tick => `${tick * 100}%`),
|
2020-01-18 09:14:30 -05:00
|
|
|
}));
|
|
|
|
|
|
|
|
const sizes = results.getSizeResults().getRelativeFileSizesPerMinifier();
|
|
|
|
results.writeSizesGraph(await renderChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
labels: sizes[0][1].map(([n]) => n),
|
|
|
|
datasets: sizes.map(([minifier, fileSizes]) => ({
|
|
|
|
label: minifier,
|
|
|
|
backgroundColor: colours[minifier],
|
|
|
|
data: fileSizes.map(([_, size]) => size),
|
|
|
|
})),
|
|
|
|
},
|
|
|
|
...chartOptions('Minified size (lower is better)', true, tick => `${tick * 100}%`),
|
|
|
|
}));
|
2020-01-09 06:40:04 -05:00
|
|
|
})();
|