webpack优化构建速度示例-并行构建：

由于js的单线程特性，文件和任务时 要等待一个任务执行完成后执行下一个任务，但在实际开发中，很多任务是可以并行执行的（如同时处理多个不同js文件或同事压缩多张图片），一些loader和插件（thread-loader或happypack）提供了额外的并行处理能力

并行前

并行后

webpack.config.js
module.exports = {
    entry: './src/index.js',
    output: {
        filename: 'main.js',
    },
    // mode: 'production', // 或者 'production'
    module: {
        rules: [
            {
            test: /\.js$/i,
            exclude: /node_modules/,
            use: [
                {  
                    loader: 'thread-loader',  
                    options: {  
                      // 工作者数量，默认为 os.cpus().length - 1  
                      // 当设置为`true`时，它会自动匹配主机上的CPU核心数  
                      workers: 4, // 或者 true  
          
                      // 持久化worker，防止重新生成  
                    //   persistent: true,  
          
                      // 传递给工作线程的loader上下文  
                      // (默认: 传递给主线程的相同上下文)  
                      // pool: {}  
          
                      // 允许跨进程共享相同的node_modules  
                      // 将极大地提升编译速度  
                      // 默认为`true`  
                      // 注意：启用此选项将禁用`pool.name`和`pool.path`  
                    //   pool: {  
                    //     type: 'shared',  
                    //   },  
          
                      // 当使用持久化工作线程时，设置超时时间（毫秒）  
                      // 在空闲时杀死工作线程  
                      // 默认为5000（5秒）  
                    //   timeout: 2000,  
          
                      // 传递给工作线程的额外选项  
                      // (默认: 传递给主线程的相同选项)  
                      // options: {},  
                    },  
                  },  
                  {  
                    loader: 'babel-loader', // 需要并行处理的loader  
                    // ... 其他babel-loader配置  
                  }, 
            ]
        }
    ]
    },
}