Vercel dev + Vite is incredibly slow; latency added to every proxy req

[izhan]

Our setup today is React + Vite, and Vercel's serverless functions. We are seeing massive page load differences between running vite vs running vite via vercel dev

vite When running vite by itself, we get massive waterfalls since Vite is fetching every single file, but overall it's quite fast loadtimes (e.g. a few seconds) since every file only takes a few ms to load.

vercel dev

But when running vercel dev and visiting localhost:3000, we have these massive waterfalls. Each req is significantly slower

Let me know what other info is helpful, as this is a massive blocker on our end. I'm on latest version of vercel.

[izhan]

Had some time to find the root cause:

1. We make a call to getVercelConfig() with every request here: https://github.com/vercel/vercel/blob/main/packages/cli/src/util/dev/server.ts#L1284
2. That call is slow when config.builds is not specified (which is usually blank for most projects). Specifically this code block here is the bottleneck: https://github.com/vercel/vercel/blob/main/packages/cli/src/util/dev/server.ts#L579. I'm guessing it's because there are I/O events w/ detectBuilders
3. This means every file request will wait for the config file to be loaded before completing (50ms on my machine). This should be fine, but fetching config files is batched, but not cached. Chrome has a max connection of 6 files, meaning after the initial 6 files are complete, another round of 6 files are fetched again, and the whole config file lookup starts over again.

The only workaround I could find right now is to specify the builds option in config, so that no I/O events are even needed. Unfortunately just found another bug that prevents it from working :( https://github.com/vercel/vercel/issues/10862

[FabioBachi]

Does anyone have any updates on this? I can't use builds because we need functions on config, and each file takes forever to load because of what you mentioned. Running vite directly works perfectly.

[izhan]

@FabioBachi our workaround given lack of support here is a patch-package on vercel package. YMMV on how this may affect your API builds, but we've been using this for past 9mo with no issues.

it's a shame that Vercel doesn't really support any setup other than Next

diff --git a/node_modules/vercel/dist/index.js b/node_modules/vercel/dist/index.js
index cb8a7e7..3d3f59d 100755
--- a/node_modules/vercel/dist/index.js
+++ b/node_modules/vercel/dist/index.js
@@ -186524,7 +186524,7 @@ var init_server = __esm({
             req.url = location;
           }
           if (callLevel === 0) {
-            await this.updateBuildMatches(vercelConfig);
+            // await this.updateBuildMatches(vercelConfig);
           }
           if (this.blockingBuildsPromise) {
             debug3("Waiting for builds to complete before handling request");
@@ -187399,7 +187399,8 @@ Please ensure that ${cmd(err.path)} is properly installed`;
         return void 0;
       }
       async _getVercelConfig() {
-        const configPath = getLocalPathConfig(this.cwd);
+        const originalCwd = process.cwd()
+        const configPath = getLocalPathConfig(originalCwd);
         const [
           pkg = null,
           // The default empty `vercel.json` is used to serve all