SSR: ssrLoadModule issue

[hemengke1997]

Describe the bug

description

I'm using antd in ssr mode, everytime startup vite devServer, it took about 40s to start.
I've debug vite source code in local, and I found that the reason is: https://github.com/vitejs/vite/blob/main/packages/vite/src/node/server/transformRequest.ts#L234

I tested three conditions:

1. use antd and vite no ssr => fast
2. use only vite ssr, no UI lib => fast
3. use antd and vite ssr => slow

BTW, I think this is not related to #8850.

Reproduction

https://github.com/hemengke1997/vps-antd-repo

System Info

System:
    OS: Windows 10 10.0.22000
    CPU: (16) x64 Intel(R) Core(TM) i7-10700F CPU @ 2.90GHz
    Memory: 5.39 GB / 23.78 GB
  Binaries:
    Node: 16.14.2 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.18 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 8.5.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 63.0.3239.132
    Edge: Spartan (44.22000.120.0), Chromium (103.0.1264.37)
    Internet Explorer: 11.0.22000.120
  npmPackages:
    @vitejs/plugin-react: ^2.0.0 => 2.0.0
    vite: ^3.0.4 => 3.0.4

Used Package Manager

pnpm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[hemengke1997]

😁 I think maybe I've figure out where is the problem: https://github.com/vitejs/vite/blob/main/packages/vite/src/node/ssr/ssrModuleLoader.ts#L253

This step is unnecessary for the deps that should be optimizatiered, e.g. antd/ lodash （这一步对于antd/lodash这种需要被预构建的依赖来说，是没有必要的）

Because after deps optimization, the complex deps with so many modules(e.g. lodash, antd) has been build into .vite/deps. So, there is no need to resolve these deps. Maybe vite should reuse the optimizered files in ssr instead of rebuild and nodeResolve（因为在预构建之后，打包好的文件已经存在于 .vite/deps 中，并且可以直接用来使用，无关SSR。或许vite应该复用这些文件，而不是重新去解析文件，解析文件这个步骤非常耗时，在debug的过程中我发现vite会不断的去读取依赖的相关依赖，比如：a 引用了 b, b 引用了 c，vite就会去解析 a b c，但是既然已经打包好了，那么这个解析是没有必要的了）

I spent some time trying to understand the code, but it was a bit difficult for me to understand the context, so I didn't dare to pr, maybe I need the help of the maintainers

cc @sapphi-red Thanks!

[hemengke1997]

Maybe there should an option to skip unhookNodeResolve https://github.com/vitejs/vite/blob/main/packages/vite/src/node/ssr/ssrModuleLoader.ts#L304

[hemengke1997]

I still have this problem in the 3.1.6 version 🥲

[bluwy]

The deps optimizer currently works for browsers only, so SSR doesn't use the bundles from .vite/deps. There is experimental support for it with ssr.optimizeDeps though.

[hemengke1997]

Thank you for your reply.
I tried using { ssr: { optimizeDeps: { include: ['antd'] } } }, and the startup is still very slow, up to a minute. I debugged vite's source code and found that the unhookNodeResolve function takes a very long time. After removing this function, it runs normally, and the startup speed only takes about 10s.

[bluwy]

I'm also not a fan of unhookNodeResolve, but I wonder if #10401 could fix the perf problem too?

[hemengke1997]

Oh, I saw it this morning, and immediately forked it, tried it locally, and still no solution.
I've been debugging vite ssr all afternoon, but the source code is so hard to understand.. 🥲
Actually, I don't understand why removing unhookNodeResolve just works, amazing...

[khalibloo]

Even using WSL or a VS Code devcontainer, the issue can't be avoided. Seems like it may not be just a Windows issue. It also affects every vite-based meta framework I've tried with. Rakkas, astro, qwik, etc.

It seems like the only work around is to use a non-vite framework. Or to not use antd.

[bluwy]

hookNodeResolve is removed in #11101. You can try the Vite 4 beta to test it out now.

[hemengke1997]

I've checkout vite 4. For me, it's still took a long time to optimize deps.

[bluwy]

The PR doesn't fix SSR optimize deps, but only for ssrLoadModule which is the problem in this issue?

[hemengke1997]

Nice!!!!!!!!!!!!!!!!!
There is no problem now
I checkout vite@4.0.0-beta.1, then I add the heavy deps to ssr.optimizeDeps and found that works well!!

ssr: {
  optimizeDeps: {
    include: ['antd', '...other heavy deps'],
    disabled: 'build'
  }
}

Thank you very much! ❤️ @bluwy

[khalibloo]

Thanks! Yes the performance has improved greatly for me with antd on vite-based frameworks using vite 4. I went from ~1m to 13-20s on Rakkas. I guess there's still work to be done on the prebundling performance.