title: React webpack bundle size is large
body: <p>I have a website that developed using react which has a single page, but the production bundle size is 1.11 MiB. I'm using firestore,firebase storage, material-UI, react-redux for this app app works well everything is fine except the bundle size.</p>
  <p><a href="https://i.stack.imgur.com/VU520.png" rel="noreferrer"><img src="https://i.stack.imgur.com/VU520.png" alt="enter image description here" /></a></p>
  <p>I used webpack-bundle-analyzer to analyse the bundle size, It seems like nodemodules tooks large size. Here I have added the screenshot.
  <a href="https://i.stack.imgur.com/l3ETR.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/l3ETR.jpg" alt="enter image description here" /></a></p>
  <p><strong>My webpack config file</strong></p>
  <pre><code>    const path = require('path');
  var CompressionPlugin = require('compression-webpack-plugin');
  const TerserPlugin = require(&quot;terser-webpack-plugin&quot;);
  const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
  
  module.exports = {
    mode: 'production',
    entry: './src/public/index.js',
    plugins: [
      new BundleAnalyzerPlugin({
        generateStatsFile : true
      }),
      new CompressionPlugin({
        deleteOriginalAssets: false,
        filename: &quot;[path][base].gz&quot;,
        algorithm: &quot;gzip&quot;,
        test: /\.js$|\.css$|\.html$/,
        threshold: 10240,
        // Compress all assets, including files with `0` bytes size
        // minRatio: Infinity
  
        // Compress all assets, excluding files with `0` bytes size
        // minRatio: Number.MAX_SAFE_INTEGER
        minRatio: 0.8,
      })
  
    ],
    optimization: {
      nodeEnv: 'production',
      minimize: true,
      concatenateModules: true,
  
    },
  
    module: {
      rules: [{
          test: /\.(jpe?g|png|gif|svg)$/,
          loader: 'image-webpack-loader',
          // This will apply the loader before the other ones
          enforce: 'pre',
        },
        {
          test: /\.m?js$/,
          exclude: /node_modules/,
          use: {
            loader: 'babel-loader',
            options: {
              presets: ['@babel/preset-env'],
              plugins: [
                [&quot;@babel/plugin-proposal-object-rest-spread&quot;, {
                  &quot;definitions&quot;: {
                    &quot;process.env&quot;: {
                      &quot;NODE_ENV&quot;: &quot;\&quot;production\&quot;&quot;
                    }
                  }
                }],
                ['babel-plugin-transform-imports',
                  {
                    '@material-ui/core': {
                      // Use &quot;transform: '@material-ui/core/${member}',&quot; if your bundler does not support ES modules
                      'transform': '@material-ui/core/esm/${member}',
                      'preventFullImport': true
                    },
                    '@material-ui/icons': {
                      // Use &quot;transform: '@material-ui/icons/${member}',&quot; if your bundler does not support ES modules
                      'transform': '@material-ui/icons/esm/${member}',
                      'preventFullImport': true
                    }
                  }
                ]
              ]
            }
          }
        }
  
      ]
    },
    output: {
      path: path.resolve(__dirname, 'build'),
      filename: 'bundle.js'
    }
  };
  </code></pre>
  <p>I don't know what I missed here to reduce node-modules size. If we have any other option to reduce bundle size please give me a suggestion for that.</p>