# 优化打包体积
# 压缩
- gzip压缩/brotli
- js （terserPlugin）
- html(html-webpack-plugin)
- css (optimizeCssAssetsWebpackPlugin)
- 图片压缩（image-webpack-loader）
# 剔除无用代码
- js Tree Shaking: 无用导出将在生产环境进行删除
- css (MinicssExtractPlugin,PurgessWebpackPlugin)
# 更小的图片体积
- webp
- avif
- 更合适的尺寸: 当页面仅需显示 100px/100px 大小图片时，对图片进行压缩到 100px/100px
- 更合适的压缩: 可对前端图片进行适当压缩，如通过 sharp 等
# 代码分割
- 路由懒加载（ import）
- bundle spliting
- 入口点分割（多页应用）
- 提取公共代码
- 使用CDN包
# 借用WASM其他语言开发工具链
# 优化打包速度
# 缩小打包范围
- exclude/include
- alias
- extensions
- resolverLoader
- modules
# 利用缓存
- 开启babel-loader缓存
- cache-loader
- hard-source-webpack-plugin
# 编译提速
browserlist/babel: 及时更新 browserlist，将会产生更小的垫片体积
使用Esbuild（go）替换 babel-loader、ts-loader
SWC（rust）
# 开启多进程
- thread-loader
- happyPack（弃用）
# 预编译
- DllPlugin
- DllReferencePlugin