1.更新版本，包括node、npm、yarn、webpack等，新版本使用更新的特性，优化更好。一句话，整新不整旧。
2.使用stats分析打包结果。官方打包以后会提供一个stats.json文件，里面包含此次打包的详情，可以使用官方提供的stats分析工具进行针对性优化。另外有第三方工具 webpack-bundle-analyzer 也可帮助分析，可自行百度关键词。
3.分析打包各阶段的总耗时，可通过 speed-measure-webpack-plugin 这个插件进行分析，包含每个loader、plugin所耗费时间，从而进行针对分析。使用方法自行搜索。
4.使用多进程打包。借助以下三个工具进行打包，发挥多核cpu的能力。
5.分离第三方模块，仅第一次进行打包，第二次以后，若引用的第三方模块没有改变，则仅打包自己的文件，可使用 DllPlugin 这个工具进行。
6.开启缓存，提升二次构建速度。主要针对loader和plugin的缓存，可通过以下三种方式进行。
babel-loader开启缓存terser-webpack-plugin开启缓存- 使用
cache-loader或者hard-source-webpack-plugin
7.对尽可能少的模块应用loader。使用 loader 的时候，我们需要在尽量少的模块中去使用。我们可以借助 include 和 exclude 这两个参数，规定 loader 只在那些模块应用和在哪些模块不应用。
8.plugin尽可能精简且可靠，同样的功能尽可能使减少plugin的使用。
9.合理使用resolve配置项，例如extensions、mainFiles、alias、modules等。
10.尽可能减少冗余模块。使用tree-shaking将冗余代码去掉。包括js、css
11.使用image-webpack-loader进行图片压缩。
12.使用动态 polyfill 服务。一般为了兼容低版本的浏览器，使低版本的浏览器也能支持类似 promise、Map、Set 等方法，我们需要引入类似 @babel/polyfill 这样的垫片，但是考虑到每一款浏览器所需的 polyfill 都是不一样的，有些可能根本就不需要，而 polyfill 的特点是非必须和不变。
13.合理使用sourceMap。根据自己情况配置sourceMap的配置项。
14.在开发环境使用内存编译，开发的时候使用webpack-dev-server进行打包开发，它使用的是内存编译存储，不会放到dist文件中。
列举的14个方向是比较基础的，性能优化的方式还有很多，可以在实践中继续摸索