Skip to content

Commit 5bc1167

Browse files
etpinardetpinard
committed
tasks: add stats script
- which generated the dist/README.md on `npm run build` - bundle specific info such as the included (trace) module and size (including gzipped size) are generated on every build
1 parent f95f9aa commit 5bc1167

File tree

2 files changed

+209
-1
lines changed

2 files changed

+209
-1
lines changed

‎package.json

+3-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,8 @@
2424
"preprocess": "node tasks/preprocess.js",
2525
"bundle": "node tasks/bundle.js",
2626
"header": "node tasks/header.js",
27-
"build": "npm run preprocess && npm run bundle && npm run header",
27+
"stats": "node tasks/stats.js",
28+
"build": "npm run preprocess && npm run bundle && npm run header && npm run stats",
2829
"cibuild": "npm run preprocess && node tasks/cibundle.js",
2930
"watch": "node tasks/watch_plotly.js",
3031
"lint": "eslint . || true",
@@ -95,6 +96,7 @@
9596
"fs-extra": "^0.30.0",
9697
"fuse.js": "^2.2.0",
9798
"glob": "^7.0.0",
99+
"gzip-size": "^3.0.0",
98100
"jasmine-core": "^2.4.1",
99101
"karma": "^1.1.0",
100102
"karma-browserify": "^5.0.1",

‎tasks/stats.js

+206
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,206 @@
1+
var path = require('path');
2+
var fs = require('fs');
3+
4+
var falafel = require('falafel');
5+
var gzipSize = require('gzip-size');
6+
var prettySize = require('prettysize');
7+
8+
var constants = require('./util/constants');
9+
var pkg = require('../package.json');
10+
11+
var pathDistREADME = path.join(constants.pathToDist, 'README.md');
12+
var cdnRoot = 'https://cdn.plot.ly/plotly-';
13+
var coreModules = ['scatter'];
14+
15+
var ENC = 'utf-8';
16+
var JS = '.js';
17+
var MINJS = '.min.js';
18+
19+
20+
// general info about distributed files
21+
var infoContent = [
22+
'# Using distributed files',
23+
'',
24+
'All plotly.js dist bundles inject an object `Plotly` into the global scope.',
25+
'',
26+
'Import plotly.js as:',
27+
'',
28+
'```html',
29+
'<script type="text/javascript" src="plotly.min.js"></script>',
30+
'```',
31+
'',
32+
'or the un-minified version as:',
33+
'',
34+
'```html',
35+
'<script type="text/javascript" src="plotly.js" charset="utf-8"></script>',
36+
'```',
37+
'',
38+
'To support IE9, put:',
39+
'',
40+
'```html',
41+
'<script>if(typeof window.Int16Array !== \'function\')document.write("<scri"+"pt src=\'extras/typedarray.min.js\'></scr"+"ipt>");</script>',
42+
'```',
43+
'',
44+
'before the plotly.js script tag.',
45+
'',
46+
'To add MathJax, put',
47+
'',
48+
'```html',
49+
'<script type="text/javascript" src="mathjax/MathJax.js?config=TeX-AMS-MML_SVG"></script>',
50+
'```',
51+
'',
52+
'before the plotly.js script tag. You can grab the relevant MathJax files in `./dist/extras/mathjax/`.',
53+
''
54+
];
55+
56+
// add bundle content/size info
57+
var mainSizes = findSizes({
58+
dist: constants.pathToPlotlyDist,
59+
distMin: constants.pathToPlotlyDistMin,
60+
withMeta: constants.pathToPlotlyDistWithMeta
61+
});
62+
var bundleInfo = [
63+
'# Bundle information',
64+
'',
65+
'The main plotly.js bundle includes all the official (non-beta) trace modules.',
66+
'',
67+
'It be can imported as minified javascript',
68+
'- using dist file `dist/plotly.min.js`',
69+
'- using CDN URL ' + cdnRoot + 'plotly-latest.min.js OR ' + cdnRoot + 'plotly-' + pkg.version + MINJS,
70+
'',
71+
'or as raw javascript:',
72+
'- using dist file `dist/plotly.js`',
73+
'- using CDN URL ' + cdnRoot + 'plotly-latest.js OR ' + cdnRoot + 'plotly-' + pkg.version + JS,
74+
'- using CommonJS with `require(\'plotly.js\')`',
75+
'',
76+
'If you would like to have access to the attribute meta information ' +
77+
'(including attribute descriptions as on the [schema reference page](https://plot.ly/javascript/reference/)), ' +
78+
'use dist file `dist/plotly-with-meta.js`',
79+
'',
80+
'The main plotly.js bundle weights in at:',
81+
'',
82+
'| plotly.js | plotly.min.js | plotly.min.js + gzip | plotly-with-meta.js |',
83+
'|-----------|---------------|----------------------|---------------------|',
84+
'| ' + mainSizes.raw + ' | ' + mainSizes.minified + ' | ' + mainSizes.gzipped + ' | ' + mainSizes.withMeta + ' |',
85+
'',
86+
'## Partial bundles',
87+
'',
88+
'Starting in `v1.15.0`, plotly.js also ships with several _partial_ bundles:',
89+
'',
90+
constants.partialBundlePaths.map(makeBundleHeaderInfo).join('\n'),
91+
''
92+
]
93+
.concat(
94+
constants.partialBundlePaths.map(makeBundleInfo)
95+
);
96+
97+
// footer info
98+
var footer = [
99+
'----------------',
100+
'',
101+
'_This file is auto-generated by `npm run stats`. ' +
102+
'Please do not edit this file directly._'
103+
];
104+
105+
var content = infoContent.concat(bundleInfo).concat(footer);
106+
107+
fs.writeFile(pathDistREADME, content.join('\n'), function(err) {
108+
if(err) throw err;
109+
});
110+
111+
function makeBundleHeaderInfo(pathObj) {
112+
var name = pathObj.name;
113+
return '- [' + name + '](#plotly.js-' + name + ')';
114+
}
115+
116+
function makeBundleInfo(pathObj) {
117+
var name = pathObj.name;
118+
var sizes = findSizes(pathObj);
119+
var moduleList = coreModules.concat(scrapeContent(pathObj));
120+
121+
return [
122+
'### plotly.js ' + name,
123+
'',
124+
formatBundleInfo(name, moduleList),
125+
'',
126+
'| Way to import | Location |',
127+
'|---------------|----------|',
128+
'| dist bundle | ' + '`dist/plotly-' + name + JS + '` |',
129+
'| dist bundle (minified) | ' + '`dist/plotly-' + name + MINJS + '` |',
130+
'| CDN URL (latest) | ' + cdnRoot + name + '-latest' + JS + ' |',
131+
'| CDN URL (latest minified) | ' + cdnRoot + name + '-latest' + MINJS + ' |',
132+
'| CDN URL (tagged) | ' + cdnRoot + name + '-' + pkg.version + JS + ' |',
133+
'| CDN URL (tagged minified) | ' + cdnRoot + name + '-' + pkg.version + MINJS + ' |',
134+
'| CommonJS | ' + '`require(\'plotly.js/lib/' + 'index-' + name + '\')`' + ' |',
135+
'',
136+
'| Raw size | Minified size | Minified + gzip size |',
137+
'|------|-----------------|------------------------|',
138+
'| ' + sizes.raw + ' | ' + sizes.minified + ' | ' + sizes.gzipped + ' | ',
139+
''
140+
].join('\n');
141+
}
142+
143+
function findSizes(pathObj) {
144+
var codeDist = fs.readFileSync(pathObj.dist, ENC),
145+
codeDistMin = fs.readFileSync(pathObj.distMin, ENC);
146+
147+
var sizes = {
148+
raw: prettySize(codeDist.length),
149+
minified: prettySize(codeDistMin.length),
150+
gzipped: prettySize(gzipSize.sync(codeDistMin))
151+
};
152+
153+
if(pathObj.withMeta) {
154+
var codeWithMeta = fs.readFileSync(pathObj.withMeta, ENC);
155+
sizes.withMeta = prettySize(codeWithMeta.length);
156+
}
157+
158+
return sizes;
159+
}
160+
161+
function scrapeContent(pathObj) {
162+
var code = fs.readFileSync(pathObj.index, ENC);
163+
var moduleList = [];
164+
165+
falafel(code, function(node) {
166+
if(isModuleNode(node)) {
167+
var moduleName = node.value.replace('./', '');
168+
moduleList.push(moduleName);
169+
}
170+
});
171+
172+
return moduleList;
173+
}
174+
175+
function isModuleNode(node) {
176+
return (
177+
node.type === 'Literal' &&
178+
node.parent &&
179+
node.parent.type === 'CallExpression' &&
180+
node.parent.callee &&
181+
node.parent.callee.type === 'Identifier' &&
182+
node.parent.callee.name === 'require' &&
183+
node.parent.parent &&
184+
node.parent.parent.type === 'ArrayExpression'
185+
);
186+
}
187+
188+
function formatBundleInfo(bundleName, moduleList) {
189+
var enumeration = moduleList.map(function(moduleName, i) {
190+
var len = moduleList.length,
191+
ending;
192+
193+
if(i === len - 2) ending = 'and';
194+
else if(i < len - 1) ending = ',';
195+
else ending = '';
196+
197+
return '`' + moduleName + '`' + ending;
198+
});
199+
200+
return [
201+
'The', '`' + bundleName + '`',
202+
'partial bundle contains the',
203+
enumeration.join(' '),
204+
'trace modules.'
205+
].join(' ');
206+
}

0 commit comments

Comments
 (0)