react 项目编译慢的问题

[fushang318]

https://github.com/Uniswap/interface 这种复杂度的前端项目，在 16 年 macbookpro （ i3 2.?G ）上启动开发环境要 5 分钟以上，热更新要半分钟，但是 CPU 没有占满，闲置 30%以上 但是 M1 上启动和热更新只需要几秒钟 这是为啥

[placeholder]

因为 M1 性能更强了

[flyqie]

你说，有没有可能瓶颈不是在 CPU ，而是在硬盘？

[kljsandjb]

CPU 没有占满大概是在 IOwait

[learningman]

换 yarn 的 pnp ，配个 swc

[IvanLi127]

cpu 30% 是按单核算的还是全部？单核没吃满非话就可能是 io 不成。

[jikeytang]

用 vite 来开发，用 webpack 来打包，能够解决编译慢的问题。

[imqiyue]

@jikeytang 为什么不直接用 vite 构建？而费劲巴拉的去用 webpack ？是 vite 有什么坑嘛？

[b0x]

swc 提升很多,肉眼可见的那种

[leokun]

@jikeytang 同问，为什么要搞的这么割裂，如果想要开发一个插件，还需要做两份

[moonrailgun]

才 5 分钟。我以前开发过开发环境启动要一个小时的。

另外我会告诉你我的项目编译一次 docker 镜像要一个小时么？
https://github.com/msgbyte/tailchat/actions/workflows/docker-publish.yml

[moonrailgun]

@moonrailgun 口胡。是启动开发环境要 10 分钟

[karott7]

编译慢是 import 写法不对，当你 import 一个文件的时候，构建工具会解析这个文件以及这个文件中所有引用的文件，然后做 tree shaking ，这是造成编译慢点主要原因之一
如果你用过 lodash 项目的话，一般都推荐你用 import debounce from 'lodash/debounce' 写法，而不推荐 import { debounce } from 'loadsh'

[karott7]

@b0x 现在 vite 中的 esbuild 直接可以解析 jsx 文件，不用 swc 也已经很快了

[duan602728596]

babel 的编译，webpack 的 loader 和 plugin ，typescript 的 type check ，还有机器的老化，都是可能的原因。

[sampeng]

因为你用 react