JavaScript代码压缩需兼顾体积减小与执行优化，主流工具推荐Terser（Webpack5+/Vite/ESBuild默认）、ESBuild（极速构建），辅以运行时开销削减、现代语法合理降级、动态导入拆分、开发代码剔除及安全配置（如mangle排除、PURE注释、source map）。
JavaScript 代码压缩不是简单删空格，而是通过工具在保持功能不变的前提下，减小文件体积、提升加载和执行效率。核心是“压缩”+“优化”双管齐下。
用主流工具做自动化压缩
手动精简不可靠也不可持续，推荐使用成熟构建工具：
- Terser：当前最主流的 JS 压缩器（Webpack 5+、Vite、ESBuild 默认集成），支持 ES6+，能安全地进行变量重命名、死代码消除、常量折叠、箭头函数简化等；
- ESBuild：极快的打包压缩工具，内置压缩能力，适合开发阶段快速构建；
- UglifyJS（旧项目可选）：仅支持到 ES5，新项目不建议；
示例（Terser CLI）：npx terser input.js --compress --mangle -o output.min.js
压缩之外的关键优化策略
光压缩文件体积不够，还要让代码跑得更高效、更容易被浏览器优化：
-
减少运行时开销：避免在循环里重复计算（如
arr.length）、慎用with和eval（阻碍 JIT 编译）； -
利用现代语法但合理降级：用
const/let替代var，帮助引擎做静态分析；搭配 Babel 或 SWC 转译时，只按需打补丁（如只转??、?.），不全量降级到 ES5； -
拆分与懒加载：用
import()动态导入非首屏逻辑，配合 Webpack/Vite 的 code splitting，让主包更轻； -
移除开发专用代码：用
process.env.NODE_ENV === 'production'包裹日志、断言，在压缩阶段由--define自动剔除；
压缩配置要“安全”而非“激进”
过度压缩可能引发问题，比如：
立即学习“Java免费学习笔记（深入）”；
- 重命名破坏外部依赖（如导出的全局函数名、CSS-in-JS 的类名）→ 配置
mangle.exclude或reserved； - 删除看似无用但被 HTML/其他语言调用的函数 → 加注释
/*#__PURE__*/或保留入口标识； - 压缩后报错难定位 → 开启 source map（生产环境可生成但不部署）；
建议在构建脚本中启用 --compress passes=2（多轮压缩更彻底），但避免开启实验性选项如 unsafe 系列，除非你完全理解其影响。
上线前再检查一遍
压缩不是终点，验证很重要：
- 对比压缩前后功能是否一致（尤其涉及
arguments、Function.prototype.toString、动态属性访问的代码）； - 用 Lighthouse 或 WebPageTest 测首屏时间、JS 执行耗时变化；
- 查看 Chrome DevTools 的 Coverage 面板，确认未用代码是否真被剔除；
基本上就这些——压缩是标准化动作，优化是持续判断。工具帮你省力，经验帮你避坑。
