Added gzip compression for JS files

package.json

@@ -30,6 +30,7 @@
     "@loadable/component": "^5.15.0",
     "babel-loader": "^8.2.2",
     "clean-webpack-plugin": "^3.0.0",
+    "compression-webpack-plugin": "^8.0.1",
     "concurrently": "^6.2.0",
     "css-loader": "^6.2.0",
     "dateformat": "^4.5.1",

server/server.js

@@ -12,6 +12,21 @@ const server = require('http').Server(app);
 //config
 app.use(express.json());
 
+//handle compressed files (middleware)
+app.get('*.js', (req, res, next) => {
+	req.url = req.url + '.gz';
+	res.set('Content-Encoding', 'gzip');
+	res.set('Content-Type', 'text/javascript');
+	next();
+});
+
+app.get('*.css', (req, res, next) => {
+	req.url = req.url + '.gz';
+	res.set('Content-Encoding', 'gzip');
+	res.set('Content-Type', 'text/css');
+	next();
+});
+
 //database connection
 const database = require('./database');
 

webpack.config.js

@@ -2,6 +2,7 @@
 const { DefinePlugin } = require('webpack');
 const { CleanWebpackPlugin } = require('clean-webpack-plugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CompressionPlugin = require('compression-webpack-plugin');
 const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
 
 //libraries
@@ -72,6 +73,13 @@ module.exports = ({ production, analyzer }) => {
 					removeAttributeQuotes: production
 				}
 			}),
+			new CompressionPlugin({
+				filename: "[path][base].gz[query]",
+				algorithm: "gzip",
+				test: /\.js$|\.css$/,
+				minRatio: 0.8,
+				deleteOriginalAssets: true
+			}),
 			new BundleAnalyzerPlugin({
 				analyzerMode: analyzer ? 'server' : 'disabled'
 			})