title: Slow Webpack & Webpack-dev-server builds
body: <p>My webpack &amp; webpack-dev-server builds are excruiatingly slow. I'll list my package.json, webpack build configurations, and stats below. I've tried removing a bunch of useless node modules, using the DLL Plugin (to no avail), Common Chunks, Caching Node Modules. Nothing seems to work. I also have no relevant global npm packages (if that makes a difference). Initial build times are slower when running webpack-dev-server (as are rebuild) than using regular old webpack (although that's slow also). </p>
  
  <p><strong>It's quite odd. Sometimes my app builds (using webpack-dev-server) in ~15 seconds, sometimes it takes 10+ minutes.</strong>  Usually slow, very rarely does it take a few seconds.</p>
  
  <p><strong>package.json</strong></p>
  
  <pre><code>    {
    "name": "xyz",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
      "build": "NODE_ENV=production webpack --config webpack/prod.config.js --progress --profile --json &gt; stats.json",
      "dev": "NODE_ENV=development webpack-dev-server --config webpack/dev.config.js --hot --colors",
      "dev:stats": "NODE_ENV=development webpack-dev-server --config webpack/dev.config.js --hot --colors --progress --profile",
      "start": "NODE_ENV=production node bin/prod.js"
    },
  ...
  </code></pre>
  
  <p>My configurations are split by <strong>base</strong>, <strong>dev</strong>, and <strong>prod</strong>. Here are my base and dev configs.</p>
  
  <p><strong>base.config.js</strong></p>
  
  <pre><code>const path = require('path');
  const webpack = require('webpack');
  const HtmlWebpackPlugin = require('html-webpack-plugin');
  
  module.exports = {
    entry: './src/index.js',
    resolve: {
      alias: {
        src: path.join(__dirname, '/../src/'),
        lib: path.join(__dirname, '/../lib/'),
      },
      extensions: ['.jsx', '.js'],
    },
    module: {
      rules: [
        { test: /\.jsx?$/, exclude: /node_modules/, use: 'babel-loader', },
        { test: /\.(eot|ttf|woff|woff2)$/, exclude: /node_modules/, loader: 'file-loader?name=[name].[ext]' },
        { test: /\.(png)(\?.*|)$/, exclude: /node_modules/, loader: 'url-loader?limit=2000000&amp;name=[name].[ext]' },
      ],
    },
    plugins: [
      new webpack.DefinePlugin({
        'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
      }),
      new HtmlWebpackPlugin({
        template: './src/index.html',
        filename: 'index.html',
      }),
      new webpack.optimize.CommonsChunkPlugin({
        name: 'node-static',
        filename: 'node-static.js',
        minChunks(module, count) {
          const context = module.context;
          return context &amp;&amp; context.indexOf('node_modules') &gt;= 0;
        },
      }),
    ],
  };
  </code></pre>
  
  <p><strong>dev.config.js</strong></p>
  
  <pre><code>const merge = require('webpack-merge');
  const baseConfig = require('./base.config');
  const FlowWebpackPlugin = require('flow-webpack-plugin');
  
  module.exports = merge(baseConfig, {
    devtool: false,
    devServer: {
      inline: true,
      contentBase: 'src',
      port: 3000,
      historyApiFallback: true,
      proxy: {
        '/api': 'http://localhost:9000',
      },
    },
    module: {
      rules: [
        {
          test: /\.scss$/,
          loader: 'style-loader!css-loader!sass-loader?modules=true&amp;localIdentName=[name]__[local]___[hash:base64:5]',
          exclude: [/node_modules/],
  
        },
        {
          test: /\.css$/,
          loader: 'style-loader!css-loader',
  
        },
      ],
    },
    plugins: [
      new FlowWebpackPlugin(),
    ]
  });
  </code></pre>
  
  <p><strong>build stats</strong></p>
  
  <pre><code>&gt; NODE_ENV=development webpack-dev-server --config webpack/dev.config.js --hot --colors --progress --profile
  
  
  Project is running at http://localhost:3000/
  webpack output is served from /
  Content not from webpack is served from src
  404s will fallback to /index.html
  10616ms building modules                                                                s
  9ms sealing
  0ms optimizing
  0ms basic module optimization
  2ms module optimization
  0ms advanced module optimization
  9ms basic chunk optimization
  0ms chunk optimization
  0ms advanced chunk optimization
  3ms module and chunk tree optimization
  0ms chunk modules optimization
  0ms advanced chunk modules optimization
  32ms module reviving
  1ms module order optimization
  2ms module id optimization
  0ms chunk reviving
  0ms chunk order optimization
  15ms chunk id optimization
  17ms hashing
  0ms module assets processing
  56ms chunk assets processing
  18ms additional chunk assets processing
  0ms recording
  0ms additional asset processing
  0ms chunk asset optimization
  150ms asset optimization
  159ms emitting
  Hash: 5ca0087e7e73b7089262
  Version: webpack 3.8.1
  Time: 105465ms
           Asset       Size  Chunks                    Chunk Names
       bundle.js     204 kB       0  [emitted]         main
  node-static.js    2.37 MB       1  [emitted]  [big]  node-static
      index.html  553 bytes          [emitted]
     [0] ./node_modules/react/react.js 56 bytes {1} [built]
         [] -&gt; factory:283ms building:85ms = 368ms
    [33] ./node_modules/react-router-dom/es/index.js 925 bytes {1} [built]
         [] -&gt; factory:361ms building:14ms = 375ms
   [280] multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/index.js 52 bytes {0} [built]
          factory:1ms building:1ms = 2ms
   [281] (webpack)-dev-server/client?http://localhost:3000 7.95 kB {1} [built]
         [] -&gt; factory:25ms building:24ms dependencies:2990ms = 3039ms
   [282] (webpack)/node_modules/node-libs-browser/node_modules/url/url.js 23.3 kB {1} [built]
         [] -&gt; factory:22ms building:3024ms = 3046ms
   [288] (webpack)-dev-server/node_modules/strip-ansi/index.js 161 bytes {1} [built]
         [] -&gt; factory:6997ms building:14ms = 7011ms
   [290] (webpack)-dev-server/node_modules/loglevel/lib/loglevel.js 7.74 kB {1} [built]
         [] -&gt; factory:6999ms building:46ms = 7045ms
   [291] (webpack)-dev-server/client/socket.js 1.05 kB {1} [built]
         [] -&gt; factory:22ms building:2995ms = 3017ms
   [293] (webpack)-dev-server/client/overlay.js 3.73 kB {1} [built]
         [] -&gt; factory:22ms building:3000ms = 3022ms
   [298] (webpack)/hot nonrecursive ^\.\/log$ 170 bytes {1} [built]
         [] -&gt; factory:12ms building:9ms dependencies:3029ms = 3050ms
   [300] (webpack)/hot/dev-server.js 1.56 kB {1} [built]
         [] -&gt; factory:55ms building:13ms = 68ms
   [301] (webpack)/hot/log-apply-result.js 1.27 kB {1} [built]
         [] -&gt; factory:3031ms building:3944ms dependencies:0ms = 6975ms
   [302] ./src/index.js 865 bytes {0} [built]
         [] -&gt; factory:73ms building:6772ms = 6845ms
   [473] ./src/components/App/App.jsx 801 bytes {0} [built]
         [] -&gt; factory:202ms building:77ms dependencies:5ms = 284ms
   [714] ./src/store.js 697 bytes {0} [built]
         [] -&gt; factory:202ms building:64ms = 266ms
      + 705 hidden modules
  Child html-webpack-plugin for "index.html":
       1 asset
         [0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 838 bytes {0} [built]
              factory:23ms building:44ms = 67ms
         [1] ./node_modules/html-webpack-plugin/node_modules/lodash/lodash.js 540 kB {0} [built]
             [] -&gt; factory:3004ms building:3974ms = 6978ms
         [2] (webpack)/buildin/global.js 488 bytes {0} [built]
             [] -&gt; factory:9ms building:14ms = 23ms
         [3] (webpack)/buildin/module.js 495 bytes {0} [built]
             [] -&gt; factory:9ms building:14ms = 23ms
  webpack: Compiled successfully.
  </code></pre>