Bundle optimizations with PurgeCSS and Terser (#959)

Bundle optimizations with PurgeCSS and Terser

web/init/package.json

@@ -71,15 +71,16 @@
     "eslint": "^5.5.0",
     "eslint-loader": "^2.1.0",
     "file-loader": "^2.0.0",
+    "glob": "^7.1.4",
     "jest": "^23.6.0",
     "jest-enzyme": "^6.0.4",
     "jsdoc-babel": "^0.5.0",
     "mini-css-extract-plugin": "^0.4.3",
     "node-sass": "^4.9.3",
-    "optimize-css-assets-webpack-plugin": "^5.0.1",
     "postcss-loader": "^3.0.0",
     "postcss-scss": "^2.0.0",
     "publish": "^0.6.0",
+    "purgecss-webpack-plugin": "^1.5.0",
     "react": "^16.5.1",
     "react-dom": "^16.5.1",
     "react-markdown-gen": "^0.0.11",
@@ -88,6 +89,7 @@
     "source-map-support": "^0.5.9",
     "style-loader": "^0.23.0",
     "svg-url-loader": "^2.3.2",
+    "terser-webpack-plugin": "^1.3.0",
     "uglifyjs-webpack-plugin": "^2.1.3",
     "url-loader": "^1.1.1",
     "webpack": "^4.20.2",

web/init/webpack.config.js

@@ -1,14 +1,19 @@
 const path = require("path");
+const glob = require('glob');
 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 const DashboardPlugin = require("webpack-dashboard/plugin");
+const TerserPlugin = require('terser-webpack-plugin');
 const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
 const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
-const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
+const PurgecssPlugin = require('purgecss-webpack-plugin');
 
 const basePlugins = [
   new MiniCssExtractPlugin({
     filename: "styles.css"
   }),
+  new PurgecssPlugin({
+    paths: glob.sync(`${path.join(__dirname, "src")}/**/*`, { nodir: true })
+  })
 ];
 
 module.exports = (env, { mode }) => {
@@ -33,17 +38,17 @@ module.exports = (env, { mode }) => {
     optimizations = {
       optimization: {
         minimizer: [
-          new UglifyJsPlugin({
-            cache: true,
-            parallel: true,
-            sourceMap: false,
-            uglifyOptions: {
+          new TerserPlugin({
+            terserOptions: {
+              warnings: false,
+              parallel: true,
+              sourceMap: false,
               output: {
                 comments: false
               }
             }
-          }),
-          new OptimizeCSSAssetsPlugin()
+            
+          })
         ]
       }
     }