wdp项目前端优化
# 依赖安装方面
# bower提前解压依赖
对应admin/capacity-scheduler/files项目;之前的依赖先压缩号,每次构建再解压到指定文件夹内;
# 分包构建
通过bash脚本,指定某个项目构建即可;
# 部署方面
场景:要涉及部分老项目jsp或者fish的老系统交付部署;之前项目是前后端一起项目,只能通过jks统一构建;
方案:已实现通过脚手架单独部署前端;从10min的Jks构建压缩下40s内更新开发环境前端;开发效率提升到20+倍
# 构建方案
# 构建速度
场景:Vue多页面的pages项目,构建速度非常慢,要3min;
单页面现在优化后单页面压缩到一半;通过loader,sourcemap,externals处理;把生成构建速度从1min压缩10s内;
方案:
# 构建包的大小
# Pages Vue项目
场景:Vue多页面的pages项目,单个页面就是很大;2.5~3M;主要是vendors文件比较大; 要考虑extends;
方案:
模块间加载方向;优化后;
多线程,babel缓存,其他loader缓存
productionSourceMap: buildCfg.isUploadSourcemap,
externals: isProd && buildCfg.isUseCdn ? cdn.externals : {},
module: {
rules: [
{
test: /\.js$/,
include: [resolve('src')],
exclude: /node_modules/,
use:[
'thread-loader',
'cache-loader',
'babel-loader?cacheDirectory',
]
}
]
},
let plugins = [
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
new HardSourceWebpackPlugin(),
]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
上次更新: 2023/11/17, 05:08:19