Forever-pending requests to dev server

[livthomas]

Describe the bug

When you try to use Vite in a large Vue.js application (1000+ modules) and run the dev server, the app won't load in a browser. If you open DevTools, you will see a lot of pending requests there. And they will stay stalled forever.

It looks like this issue only occurs in Chromium-based browsers. I can reproduce it in both Brave and Chromium. But it works without any problems in Firefox or GNOME Web (WebKit).

Reproduction

1. Go to pending-requests folder of vite-bugs repo.
2. Run npm install
3. Run npm run dev
4. Open a new tab in any Chromium-based browser
5. Open DevTools and switch to the Network tab
6. Go to http://localhost:3000/

System Info

System:
    OS: Linux 5.10 Manjaro Linux
    CPU: (16) x64 AMD Ryzen 7 PRO 4750U with Radeon Graphics
    Memory: 8.34 GB / 30.65 GB
    Container: Yes
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.10.0 - /usr/bin/node
    Yarn: 1.22.10 - ~/.npm-global/bin/yarn
    npm: 8.1.0 - ~/.npm-global/bin/npm
  Browsers:
    Brave Browser: 1.30.87 (Chromium: 94.0.4606.71)
    Chromium: 94.0.4606.81
    Firefox: 93.0
  npmPackages:
    @vitejs/plugin-vue: ^1.9.3 => 1.9.3 
    vite: ^2.6.4 => 2.6.7

Used Package Manager

npm

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 https://github.com/vuejs/vue-next 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.

[tony19]

I cannot reproduce the issue in macOS.

Chrome 94.0.4606.81:

Brave 1.30.89 Chromium: 94.0.4606.81:

System:
    OS: macOS 11.2.3
    CPU: (8) x64 Intel(R) Core(TM) i7-6820HQ CPU @ 2.70GHz
    Memory: 2.58 GB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.4.2 - ~/n/bin/node
    Yarn: 1.16.0 - ~/n/bin/yarn
    npm: 7.18.1 - ~/n/bin/npm
  Browsers:
    Brave Browser: 94.1.30.89
    Chrome: 94.0.4606.81
    Chrome Canary: 97.0.4670.0
    Edge: 94.0.992.50
    Firefox: 91.0.2
    Safari: 14.0.3
  npmPackages:
    @vitejs/plugin-vue: ^1.9.3 => 1.9.3 
    vite: ^2.6.4 => 2.6.7 

[livthomas]

@tony19 Thanks for testing this. It looks like this issue only occurs in Chromium-based browsers on Linux. I wasn't able to reproduce it in either Chrome or Edge on Windows 10. But I reproduced it easily in Chromium on Ubuntu 20.04.

[antick]

I am also facing a similar problem while setting up the below project with a lot of components.

https://github.com/directus/directus

I am using a Ubuntu 21.04 laptop and a chrome browser.

Update: I tried it with Firefox and it worked fine. The problem only exists with Linux Chrome Browser.

[Stijn98s]

I have the same problem under linux (21.04 and 21.10). Firefox and Chrome MacOS working fine. Cannot find whats causing this bug.

[srsholmes]

I am also experiencing this issue, on a svelteKit application, and have had it across both Firefox and chrome in MacOS. I am thinking it may be related to file descriptors limit being reached or something similar.

I use Webstorm to develop in primarily. I was thinking maybe it was trying to index files or something, which was interfering, but it made no difference when I quit the process.

The problem comes and goes, but nothing seems to really consistently 'fix' the problem, except restating the computer.

Disabling cache in the browser dev tools does not help either.

[livthomas]

@srsholmes Thanks for the hint! It is really a problem with the file descriptors limit.

On Manjaro Linux (Arch-based), I was able to solve it by adding the following line to both /etc/systemd/system.conf and /etc/systemd/user.conf file:

DefaultLimitNOFILE=65536

After this change, Vite works without any issues in both Brave and Chromium browsers!

Maybe the fact that you can run into this issue once you have a project of a certain size could be mentioned in the Vite documentation.

[cedeber]

Confirmed issue in our side as well. What I can tell is that it looks like with older version of Chrome it was working. But I can't tell how old precisely, unfortunately (before 84 - July 2020 - for what I remember). Not sure that new version of Chrome changed the way it handles files :-/ (as Firefox works)

We also discovered that configuring server.hmr: false works somehow, sometimes.

[cedeber]

After some investigations on our side, looks like the solution given by @livthomas works for us too. I've found a Chromium issue that may be related to that: https://bugs.chromium.org/p/chromium/issues/detail?id=1184950&q=ulimit&can=2

[olejorgenb]

I've also experienced something I think is the same problem. (But not consistently) Today I manager to open the dev tools before the chrome tab "hanged" and I saw a bunch of pending requests.

I tested out increasing the open-files limit and it seems to have done the trick 🎉

It's possible to do it more temporarily as follows (close chrome completely first):

# Check the current limits
$ ulimit -Sn 
1024
# Change limit
$ ulimit -Sn 10000
$ google-chrome
# Verify that chrome got the new limit:
$ ps -eaf | grep chrome
$ cat /proc/$PIDOFCHROME/limits

Chrome version: Version 96.0.4664.45 (Official Build) (64-bit) (linux)

[ogustavo-pereira]

I have same problem too

[padcom]

Same problem on Linux Mint:

$ ulimit -Sn
1048576

yet still, the dev server hangs forever