feat: minify HTML on build (#2537)

1. Improve html-minifier's options.
2. Skip html-minifier on dev.

Author: nschonni

build.js

@@ -16,6 +16,7 @@ const markdown = require('metalsmith-markdown')
 const prism = require('metalsmith-prism')
 const permalinks = require('metalsmith-permalinks')
 const pagination = require('metalsmith-yearly-pagination')
+const htmlMinifier = require('metalsmith-html-minifier')
 const defaultsDeep = require('lodash.defaultsdeep')
 const autoprefixer = require('autoprefixer')
 const marked = require('marked')
@@ -46,6 +47,33 @@ const markedOptions = {
   renderer
 }
 
+const htmlMinifierOpts = {
+  collapseBooleanAttributes: true,
+  collapseWhitespace: true,
+  conservativeCollapse: true, // This is needed as things are now
+  decodeEntities: true,
+  minifyCSS: {
+    level: {
+      1: {
+        specialComments: 0
+      }
+    }
+  },
+  minifyJS: false, // we don't have a lot inline JS and this slows down things
+  minifyURLs: false,
+  processConditionalComments: true,
+  removeAttributeQuotes: true,
+  removeComments: true,
+  removeOptionalAttributes: true,
+  removeOptionalTags: true,
+  removeRedundantAttributes: true,
+  removeScriptTypeAttributes: true,
+  removeStyleLinkTypeAttributes: true,
+  removeTagWhitespace: false,
+  sortAttributes: true,
+  sortClassName: true
+}
+
 // This function imports a given language file and uses the default language set
 // in DEFAULT_LANG as a fallback to prevent any strings that aren't filled out
 // from appearing as blank.
@@ -179,6 +207,8 @@ function buildLocale (source, locale, opts) {
       pattern: /\.js$/
     }))
     .use(layouts())
+    // Use the default options
+    .use(process.env.NODE_ENV !== 'development' ? htmlMinifier({ minifierOptions: htmlMinifierOpts }) : '')
     // Pipes the generated files into their respective subdirectory in the build
     // directory.
     .destination(path.join(__dirname, 'build', locale))

package-lock.json

@@ -50,6 +50,7 @@
     "metalsmith-discover-helpers": "^0.1.1",
     "metalsmith-discover-partials": "^0.1.2",
     "metalsmith-feed": "^1.0.0",
+    "metalsmith-html-minifier": "^4.0.0",
     "metalsmith-layouts": "^2.3.1",
     "metalsmith-markdown": "^1.3.0",
     "metalsmith-metadata": "0.0.4",