Optimization of assets (#585)

* quick optimization of assets

* typo

Author: mmahalwy

package.json

@@ -56,6 +56,7 @@
     "cache-manager": "1.5.0",
     "clean-webpack-plugin": "0.1.10",
     "compression": "1.6.2",
+    "compression-webpack-plugin": "0.3.2",
     "cookie-parser": "1.4.3",
     "copy-to-clipboard": "3.0.5",
     "cors": "2.7.1",
@@ -92,6 +93,7 @@
     "react-dom": "15.4.1",
     "react-helmet": "3.1.0",
     "react-inlinesvg": "0.5.4",
+    "react-intl": "2.1.5",
     "react-metrics": "1.2.1",
     "react-paginate": "4.1.0",
     "react-redux": "5.0.1",
@@ -117,7 +119,6 @@
     "url-loader": "0.5.7",
     "webpack": "2.1.0-beta.20",
     "webpack-isomorphic-tools": "2.5.7",
-    "react-intl": "2.1.5",
     "winston": "1.1.2"
   },
   "devDependencies": {
@@ -170,6 +171,7 @@
     "wdio-mocha-framework": "0.3.7",
     "wdio-spec-reporter": "0.0.3",
     "webdriverio": "4.2.1",
+    "webpack-bundle-analyzer": "2.2.1",
     "webpack-dev-server": "1.6.5",
     "webpack-hot-middleware": "2.12.2"
   },

webpack/dev.config.js

@@ -1,6 +1,7 @@
 require('dotenv').load();
 const webpack = require('webpack');
 const path = require('path');
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 const IsomorphicPlugin = require('webpack-isomorphic-tools/plugin');
 const webpackIsomorphicToolsPlugin = new IsomorphicPlugin(require('./isomorphic-tools-configuration')); // eslint-disable-line max-len, global-require
 
@@ -113,7 +114,8 @@ module.exports = {
     new webpack.EnvironmentPlugin([
       'NODE_ENV'
     ]),
-    webpackIsomorphicToolsPlugin.development()
+    webpackIsomorphicToolsPlugin.development(),
+    new BundleAnalyzerPlugin()
   ],
   stats: {
     colors: true,

webpack/prod.config.js

@@ -1,11 +1,13 @@
 const path = require('path');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const webpack = require('webpack');
+const CompressionPlugin = require('compression-webpack-plugin');
 const CleanPlugin = require('clean-webpack-plugin');
 const IsomorphicPlugin = require('webpack-isomorphic-tools/plugin');
 const strip = require('strip-loader');
 
 const webpackIsomorphicToolsPlugin = new IsomorphicPlugin(require('./isomorphic-tools-configuration')); // eslint-disable-line max-len, global-require
+
 const relativeAssetsPath = '../static/dist';
 const assetsPath = path.join(__dirname, relativeAssetsPath);
 
@@ -19,7 +21,7 @@ module.exports = {
 
   },
   context: path.resolve(__dirname, '../src'),
-  devtool: 'cheap-source-map',
+  devtool: 'cheap-module-source-map',
   debug: false,
   target: 'web',
   cache: false,
@@ -142,6 +144,13 @@ module.exports = {
       minimize: true,
       debug: false
     }),
+    new CompressionPlugin({
+      asset: '[path].gz[query]',
+      algorithm: 'gzip',
+      test: /\.js$|\.css$|\.html$/,
+      threshold: 10240,
+      minRatio: 0
+    }),
     webpackIsomorphicToolsPlugin
   ]
 };