webpack 打包性能优化
webpack 打包性能优化
开启多线程打包 thread-loader
https://www.npmjs.com/package/thread-loader
https://github.com/webpack-contrib/thread-loader
module.exports = {
module: {
rules: [
{
test: /\.js$/,
include: path.resolve('src'),
use: [
'thread-loader',
// your expensive loader (e.g babel-loader)
],
},
],
},
};
use: [
{
loader: 'thread-loader',
// loaders with equal options will share worker pools
options: {
// the number of spawned workers, defaults to (number of cpus - 1) or
// fallback to 1 when require('os').cpus() is undefined
workers: 2,
// number of jobs a worker processes in parallel
// defaults to 20
workerParallelJobs: 50,
// additional node.js arguments
workerNodeArgs: ['--max-old-space-size=1024'],
// Allow to respawn a dead worker pool
// respawning slows down the entire compilation
// and should be set to false for development
poolRespawn: false,
// timeout for killing the worker processes when idle
// defaults to 500 (ms)
// can be set to Infinity for watching builds to keep workers alive
poolTimeout: 2000,
// number of jobs the poll distributes to the workers
// defaults to 200
// decrease of less efficient but more fair distribution
poolParallelJobs: 50,
// name of the pool
// can be used to create different pools with elsewise identical options
name: 'my-pool',
},
},
// your expensive loader (e.g babel-loader)
];
prewarming 预热
const threadLoader = require('thread-loader');
threadLoader.warmup(
{
// pool options, like passed to loader options
// must match loader options to boot the correct pool
},
[
// modules to load
// can be any module, i. e.
'babel-loader',
'babel-preset-es2015',
'sass-loader',
]
);
为防止启动工作程序时出现高延迟,可以预热工作程序池。
这将引导池中的最大工作程序数量,并将指定的模块加载到node.js模块高速缓存中。
refs
shit 翻译
https://webpack.docschina.org/loaders/thread-loader/

Lerna
https://zzk.cnblogs.com/my/s/blogpost-p?Keywords=Lerna
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!
webpack 打包性能优化的更多相关文章
- webpack打包性能优化
1. 使用 gzip 压缩打包后的 js 文件 这个方法优化浏览器下载时的文件大小(打包后的文件大小没有改变) webpack.config.prod.js 中 var CompressionWebp ...
- 最全 webpak4.0 打包性能优化清单
最全 webpak4.0 打包性能优化清单 webpack4.0如何进行打包优化? 无非是从两个角度进行优化,其一:优化打包速度,其二:优化打包体积,送你一份打包性能优化清单 1.使用loader的时 ...
- webpack打包性能分析
1. 如何定位webpack打包速度慢的原因 首先需要定位webpack打包速度慢的原因,才能因地制宜采取合适的方案,我们可以在终端输入: webpack --profile --json > ...
- webpack打包体积优化
优化: 1:外部引入模块(cdn) 如 jquery,zepto,d3, bootstrap这些固定的lib 使用cdn直接引用就可以,没有必要打包到build,有效利用302. 2:图标优化 ...
- 深入浅出的webpack构建工具---tree shaking打包性能优化(十二)
阅读目录 1. 什么是tree-shaking? 2. 在webpack中如何使用 tree-shaking 呢? 3. 使用webpack-deep-scope-plugin 优化 回到顶部 1. ...
- Webpack打包效率优化篇
Webpack基础配置: 语法解析:babel-loader 样式解析:style-loader css解析:css-loader less解析:less-loader 文件解析:url-loader ...
- vue 应用生产环境的 webpack 打包配置优化
转:https://blog.csdn.net/robin_star_/article/details/83856363 前言:很好的打包优化的帖子,还没来的急去实测验证 1. 去掉 console ...
- webpack 打包性能分析工具
webpack-bundle-analyzer,推荐使用 新版 vue-cli (旧版按照新版的进行配置即可)已经集成该插件,在项目的 package.json 文件中注入如下命令,然后运行(npm ...
- 彻底解决Webpack打包慢的问题
转载 这几天写腾讯实习生 Mini 项目的时候用上了 React 全家桶,当然同时引入了 Webpack 作为打包工具.但是开发过程中遇到一个很棘手的问题就是,React 加上 React-Route ...
随机推荐
- Python攻城——查看,生成幫助文檔
1. python在控制台中查看文檔 1 python -m pydoc 模塊名 2. pydoc生成HTML文檔 1 python -m pydoc -w 模塊名 1 python -m pydoc ...
- 解决Spirng注入时名称下的红色波浪线
解决Spirng注入时名称下的红色波浪线 报错情形: 解决办法: 方案一: 如果可以正常运行,那么可能是类没有交给Spring管理,如下图,我们只需要在对应的接口(或者类上)加上@Component注 ...
- cc 攻击
糟糕,系统又被攻击了 原创 二马读书 二马读书 10月16日 几年前,我们的电商平台遭遇过一次CC攻击(一种分布式网络攻击,后面有详细介绍
- Jenkins部署web项目到Tomcat(shell脚本)
一.首先配置Publish Over SSH插件 配置地址:系统管理-->系统设置-->Publish over SSH(需要安装Publish over SSH插件) 二.jenkins ...
- TCP IP SOCKET 笔记
网络由下往上分为 物理层.数据链路层.网络层.传输层.会话层.表示层和应用层. 通过初步的了解,我知道IP协议对应于网络层,TCP协议对应于传输层,而HTTP协议对应于应用层, 三者从本质上来说没有可 ...
- ubuntu14.04 ssh允许root用户远程登录
vi /etc/ssh/sshd_config #注释掉 #PermitRootLogin without-password # Authentication: LoginGraceTime 120 ...
- Codeforces Round #652 (Div. 2) A. FashionabLee(几何)
题目链接:https://codeforces.com/contest/1369/problem/A 题意 判断正 $n$ 边形能否通过旋转使得一边与 $x$ 轴平行,一边与 $y$ 轴平行. 题解 ...
- 【poj 1961】Period(字符串--KMP 模版题)
题意:给你一个字符串,求这个字符串到第 i 个字符为止的重复子串的个数. 解法:判断重复子串的语句很重要!!if (p && i%(i-p)==0) printf("%d % ...
- Codeforces Round #633 div2 A~C
A. Filling Diamonds 题意:给你n个菱形方块,问能构成图示形状的有多少种 题解:自己画几个不难发现答案是n 代码: 1 #include <iostream> 2 #in ...
- Codeforces Round #531 (Div. 3) B. Array K-Coloring (结构体排序)
题意:给你\(n\)个数字,用\(k\)种颜色给他们涂色,要求每个数字都要涂,每种颜色都要用,相同的数字不能涂一样的颜色. 题解:用结构体读入每个数字和它的位置,然后用桶记录每个数字出现的次数,判断是 ...