Here's how you enable brotli to load your web apps 95.5% faster (or 50% faster if you're using webpack -p)

enabling brotli.txt

// Webpack.config.js
const brotliPlugin = require('brotli-gzip-webpack-plugin')

// Inside your config
plugins: [
  new brotliPlugin({
    asset: '[file].br[query]',
    algorithm: 'brotli',
    test: /\.(js|css|html|svg)$/,
    threshold: 10240,
    minRatio: 0.8,
    quality: NODE_ENV != 'production' ? 0 : 11,
  }),
  new brotliPlugin({
    asset: '[file].gz[query]',
    algorithm: 'gzip',
    test: /\.(js|css|html|svg)$/,
    threshold: 10240,
    minRatio: 0.8,
    quality: NODE_ENV != 'production' ? 0 : 11,
  }),
]


// Server.js
if (req.header('Accept-Encoding').includes('br')) {
  res.set('Content-Encoding', 'br')
  res.set('Content-Type', 'application/javascript; charset=UTF-8')
  return res.sendFile(join(__dirname, '..', 'dist', 'build.js.br'))
} else if(req.header('Accept-Encoding').includes('gz')) {
  res.set('Content-Encoding', 'gzip')
  res.set('Content-Type', 'application/javascript; charset=UTF-8')
  return res.sendFile(join(__dirname, '..', 'dist', 'build.js.gz'))
}

If you want to learn web development, check my new course heatoon.com which I made by myself to teach you everything you need to know to start working as a fullstack web developer in 2 weeks. Available now on heatoon.com

Awesome stuff!