再看起因。建立一次够下楼吃顿饭再上来

我们团队的前端项目基于 Create React App，没有 eject。项目跑了三年，从最初的 20个页面膨胀到 50+个页面、200多个组件。依赖从几十个涨到上千个，生产建立时间从最初的一分钟出头，逐步恶化到10分钟+

10分钟代表着：

• 提交 PR → 等CI建立失败 → 改代码 → 再提交 → 再等10分钟...
• 一天下来光等建立就能浪费一个多小时！
• 同事们抱怨："我都能下楼吃完一份奶茶再回来了..."

团队讨论过是否 eject 或迁移到 Vite。但 eject 之后要自己维护 Webpack 配置，迁移 Vite 的改动量太大。 最终我们决定在不 eject 的前提下把能做的小调整全做了。结果远超预期——生产建立从10分钟降到了40秒！话说回来，

再看诊断。先搞清楚时间都去哪了，

调整之前，得先知道瓶颈在哪。我用react-scripts build --profile --json> stats.json生成耗时报告： 接下来用 webpack-bundle-analyzer 和 speed-measure-webpack-plugin 分析耗时。

调整效果总览

Babel转译

- 原因: CRA默认使用Babel进行JS/TS转译 - 特性:单线程处理 | 每次重新编译 | 没有持久缓存机制

3分20秒

1.8秒 瞬时 使用esbuild-loader + 持久缓存

: ✅ 减少94%的转译时间 ✅ 首屏加载速度提高明显 ✅ 开发者反馈:"热更新终于快得像Vite一样了!" : https://gpt.plus.com/optimize-cra#babel-to-esbuild-migration-guide-for-decorators .