Webpack打包性能优化之多进程
概述
多进程的打包⽅式可以有效提⾼打包速度，这其实跟 CPU 执⾏任务的⽅式有关系。我们可以简单说说为什么多进程打包会⽐较快：CPU 在某⼀个时间点只能处理⼀件事情（在这⾥我们粗暴的认为就是运⾏某个进程），假如说现在总共运⾏着 100 个进程，那么1个打包进程被执⾏到的概率就是1%，但是如果我们有 5 个进程是执⾏打包的，那么打包进程被运⾏到的概率就是 5%！说⽩了就是⼈多好办事！
⽅案细节
webpack打包流程 面试第⼀步：安装 thr ea d-lo a der
npm i thread-loader -D
第⼆步：使⽤ thr ea d-lo a der
因为它是⼀个 loader，所以它跟⼀般的 loader 使⽤⽅法是⼀样的。具体使⽤⽅式如下：
{
test: /\.js$/,
exclude: /node_modules/,
use: [
'thread-loader',
{
loader: 'babel-loader',
options: {
...
}
]
}
因为启动多进程是需要耗费额外的时间有些⼩伙伴使⽤ thread-loader 以后，发现打包时间不但没有变短⽽且变长了！ 这⼜是怎么回事呢？因为启动多进程是需要耗费额外的时间的，⼤概是600ms，⽽且进程间需要通信以同步打包的进度，所以多进程打包⽐较适合在原本打包时间⽐较长的场景下使⽤。对于本来打包时间就很短的场景来说，使⽤多进程反⽽是得不偿失！在使⽤多进程打包时，我们⼀般会把它和 babel-loader ⼀起使⽤，因为⼀般来说打包时间就很短的场景来说，使⽤多进程反⽽是得不偿失！
babel-loader 编译js代码的过程是⽐较耗时的！
注意：thread-loader ⼀定要放在 babel-loader 前⾯。根据 loader 的执⾏顺序，thread-loader是其实后执⾏的，这个顺序不能变！
结语
上⾯提到我们⼀般会把 thread-loader 跟 babel-loader ⼀起使⽤，当然我们也可以跟其他 loader ⼀起使⽤。总的来说，我们需要充分考虑⾃⼰的项⽬场景，有选择的去使⽤ thread-loader，这样才能事半功倍。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。