2020-07-24 04:24:28 -04:00
|
|
|
const esbuild = require('esbuild');
|
|
|
|
const htmlMinifier = require('html-minifier');
|
|
|
|
const minifyHtml = require('@minify-html/js');
|
|
|
|
const minimize = require('minimize');
|
|
|
|
|
2021-01-07 08:26:02 -05:00
|
|
|
const testJsAndCssMinification = process.env.HTML_ONLY !== '1';
|
2020-07-24 04:24:28 -04:00
|
|
|
|
|
|
|
const jsMime = new Set([
|
|
|
|
undefined,
|
|
|
|
'application/ecmascript',
|
|
|
|
'application/javascript',
|
|
|
|
'application/x-ecmascript',
|
|
|
|
'application/x-javascript',
|
|
|
|
'text/ecmascript',
|
|
|
|
'text/javascript',
|
|
|
|
'text/javascript1.0',
|
|
|
|
'text/javascript1.1',
|
|
|
|
'text/javascript1.2',
|
|
|
|
'text/javascript1.3',
|
|
|
|
'text/javascript1.4',
|
|
|
|
'text/javascript1.5',
|
|
|
|
'text/jscript',
|
|
|
|
'text/livescript',
|
|
|
|
'text/x-ecmascript',
|
|
|
|
'text/x-javascript',
|
|
|
|
]);
|
|
|
|
|
|
|
|
class EsbuildAsync {
|
|
|
|
constructor () {
|
|
|
|
this.promises = [];
|
|
|
|
}
|
|
|
|
|
2021-04-07 07:45:14 -04:00
|
|
|
queue (code, type) {
|
2020-07-24 04:24:28 -04:00
|
|
|
const id = this.promises.push(esbuild.transform(code, {
|
2021-04-07 07:45:14 -04:00
|
|
|
loader: type,
|
2020-07-24 04:24:28 -04:00
|
|
|
minify: true,
|
|
|
|
minifyWhitespace: true,
|
|
|
|
minifyIdentifiers: true,
|
|
|
|
minifySyntax: true,
|
|
|
|
})) - 1;
|
|
|
|
return `_____ESBUILD_ASYNC_PLACEHOLDER_${id}_____`;
|
|
|
|
}
|
|
|
|
|
|
|
|
async finalise (html) {
|
|
|
|
const jsTransformResults = await Promise.all(this.promises);
|
2021-04-07 08:08:44 -04:00
|
|
|
return html.replace(/_____ESBUILD_ASYNC_PLACEHOLDER_([0-9]+)_____/g, (_, id) => jsTransformResults[id].code);
|
2020-07-24 04:24:28 -04:00
|
|
|
}
|
|
|
|
}
|
2020-01-09 04:45:14 -05:00
|
|
|
|
2021-01-07 08:26:02 -05:00
|
|
|
const minifyHtmlCfg = minifyHtml.createConfiguration({
|
|
|
|
minifyJs: testJsAndCssMinification,
|
|
|
|
minifyCss: testJsAndCssMinification,
|
|
|
|
});
|
2020-07-24 23:59:21 -04:00
|
|
|
const htmlMinifierCfg = {
|
|
|
|
collapseBooleanAttributes: true,
|
|
|
|
collapseInlineTagWhitespace: true,
|
|
|
|
collapseWhitespace: true,
|
|
|
|
// minify-html can do context-aware whitespace removal, which is safe when configured correctly to match how whitespace is used in the document.
|
|
|
|
// html-minifier cannot, so whitespace must be collapsed conservatively.
|
|
|
|
// Alternatively, minify-html can also be made to remove whitespace regardless of context.
|
|
|
|
conservativeCollapse: true,
|
|
|
|
customEventAttributes: [],
|
|
|
|
decodeEntities: true,
|
|
|
|
ignoreCustomComments: [],
|
|
|
|
ignoreCustomFragments: [/<\?[\s\S]*?\?>/],
|
2021-01-07 08:26:02 -05:00
|
|
|
// These will be set later if `testJsAndCssMinification` is true.
|
|
|
|
minifyCSS: false,
|
2020-07-24 23:59:21 -04:00
|
|
|
minifyJS: false,
|
|
|
|
processConditionalComments: true,
|
|
|
|
removeAttributeQuotes: true,
|
|
|
|
removeComments: true,
|
|
|
|
removeEmptyAttributes: true,
|
|
|
|
removeOptionalTags: true,
|
|
|
|
removeRedundantAttributes: true,
|
|
|
|
removeScriptTypeAttributes: true,
|
|
|
|
removeStyleLinkTypeAttributes: true,
|
|
|
|
removeTagWhitespace: true,
|
|
|
|
useShortDoctype: true,
|
|
|
|
};
|
|
|
|
|
2020-01-09 04:45:14 -05:00
|
|
|
module.exports = {
|
2020-07-24 23:59:21 -04:00
|
|
|
'@minify-html/js': (_, buffer) => minifyHtml.minifyInPlace(Buffer.from(buffer), minifyHtmlCfg),
|
2021-01-07 08:26:02 -05:00
|
|
|
'html-minifier': testJsAndCssMinification
|
2020-07-24 23:59:21 -04:00
|
|
|
? async (content) => {
|
|
|
|
const js = new EsbuildAsync();
|
|
|
|
const res = htmlMinifier.minify(content, {
|
|
|
|
...htmlMinifierCfg,
|
2021-04-07 07:45:14 -04:00
|
|
|
minifyCSS: code => js.queue(code, 'css'),
|
|
|
|
minifyJS: code => js.queue(code, 'js'),
|
2020-07-24 23:59:21 -04:00
|
|
|
});
|
|
|
|
return js.finalise(res);
|
|
|
|
}
|
|
|
|
: content => htmlMinifier.minify(content, htmlMinifierCfg),
|
2021-01-07 08:26:02 -05:00
|
|
|
'minimize': testJsAndCssMinification
|
2020-07-24 23:59:21 -04:00
|
|
|
? async (content) => {
|
|
|
|
const js = new EsbuildAsync();
|
2021-01-07 08:26:02 -05:00
|
|
|
const res = new minimize({
|
|
|
|
plugins: [
|
|
|
|
{
|
|
|
|
id: 'esbuild',
|
|
|
|
element: (node, next) => {
|
|
|
|
if (node.type === 'text' && node.parent) {
|
|
|
|
if (node.parent.type === 'script' && jsMime.has(node.parent.attribs.type)) {
|
2021-04-07 07:45:14 -04:00
|
|
|
node.data = js.queue(node.data, 'js');
|
2021-01-07 08:26:02 -05:00
|
|
|
} else if (node.parent.type === 'style') {
|
2021-04-07 07:45:14 -04:00
|
|
|
node.data = js.queue(node.data, 'css');
|
2021-01-07 08:26:02 -05:00
|
|
|
}
|
|
|
|
}
|
|
|
|
next();
|
|
|
|
},
|
2020-07-24 23:59:21 -04:00
|
|
|
},
|
2021-01-07 08:26:02 -05:00
|
|
|
],
|
|
|
|
}).parse(content);
|
2020-07-24 23:59:21 -04:00
|
|
|
return js.finalise(res);
|
|
|
|
}
|
|
|
|
: content => new minimize().parse(content),
|
2020-01-09 04:45:14 -05:00
|
|
|
};
|