Webpack-dev-server: Higher CPU usage with node

[nodece]

• Operating System: MacOS 10.14.1
• Node Version: v10.16.0
• NPM Version: yarn - 1.17.3
• webpack Version: 3.8.1
• webpack-dev-server Version: 2.9.4
• Browser: Chrome

After running webpack-dev-server, the CPU occupancy is between 100% and 200%.

Do you have such an issue?

[rishabh3112]

@nodece please share a minimal reproducible repo and steps to reproduce.
Also, the issue is the same as #1881

[nodece]

@rishabh3112 can I send the reproducible repo to your email?

[rishabh3112]

Sharing publically would be great, that way we all can investigate for the issue. :)

[nodece]

Maybe it's caused by mds_stores process in MacOS.
I hope I can collect some answers here. :)

[cismous]

I have same issue

• Operating System: MacOS 10.14.5
• Node Version: v12.6.0
• Yarn Version: 1.17.3
• webpack Version: 4.29.6
• webpack-dev-server Version: 3.7.2
• cpu: i7 6700K

After running webpack-dev-server, the CPU occupancy is between 20% and 30%.

[alexander-akait]

Please create minimum reproducible test repo otherwise issue was closed, thanks

[danvk]

I was able to fix this by following the advice of #1180 and installing fsevents:

npm install -D fsevents

It was previously installed as a transitive dependency, but installing it explicitly made all the difference.

[briandhill]

I concur with @danvk on his remedy. Just to note, I'm running on macOS Mojave 10.14.6.

[LvChengbin]

@danvk it's not working for me, the CPU occupancy is always more than 160%

[binaryj]

Using the approach that @danvk suggested worked for me. You have to install fsevents as a dev dependency of the project you are running the webpack dev server for. My CPU usage was up around 160% prior to the install and is now around 15% post install.

[LvChengbin]

@binaryj I added more directories into the ignored list in watchOptions, and it's much better than before.

[binaryj]

UPDATE: I used the "fsevents" approach suggested by @danvk and it seemed to work for a few minutes, but then my CPU shot back up to 130% - 160% consistently for the node process. I then uninstalled the "fsevents" package from the project and tried @LvChengbin approach of updating my webpack config to set "watchOptions" to ignore nodeModules. I also set it to "poll" every second:

watchOptions: {
     poll: 1000,
     ignored: ["node_modules"]
}

Doing this has dropped my CPU usage for the node process to around 15% consistently now and has resolved my issue. I then reduced the "poll" frequency to 5 seconds(5000ms) instead of 1(1000ms) second and my CPU is consistently around 4% for the node process.

The approach originally suggested by @LvChengbin should be the correct answer to this issue and doesn't involve adding any new packages to your project.

[ulitiy]

If you're using ts-loader it's better to use TSC_WATCHFILE=UseFsEventsWithFallbackDynamicPolling webpack-dev-server command so it forces ts-loader to use fsevents too.

15% consistently with no polling.

[oivinds]

I switched from node v10.14.0 (npm v6.4.1) to node v11.3.0
My cpu is now 0,0 % when idle.

[Oshri-Garama]

Had the same problem, I had warning about gyp: No Xcode or CLT version when installed npm.
The solution is in here:
https://medium.com/flawless-app-stories/gyp-no-xcode-or-clt-version-detected-macos-catalina-anansewaa-38b536389e8d
reinstall Xcode.

[sreuter]

This really needs to be addressed in webpack itself, by updating the chokidar dependency to 3.x.

[hiroppy]

We can't update chokidar to the major version because it's breaking changes, but we'll upgrade it when we release the major version of webpack-dev-server. Please wait.

[joelrbrandt]

Had the same problem, I had warning about gyp: No Xcode or CLT version when installed npm.
The solution is in here:
https://medium.com/flawless-app-stories/gyp-no-xcode-or-clt-version-detected-macos-catalina-anansewaa-38b536389e8d
reinstall Xcode.

For me, on Catalina, simply running sudo xcode-select --reset resolved the gyp problems for building fsevents.

[cubbK]

I had this problem because I also had watchman installed. Running brew uninstall watchman helped 🤔

[jeffreyvanhees]

I cleard the Notification Center cache and the problem disappeared immediately.

cd $TMPDIR cd .. cd 0 sudo rm -rf ./com.apple.notificationcenter killall NotificationCenter; killall usernoted

[wayneforrest]

I did the following to reduce my node CPU usage on MacOS Big Sur; it went from 40% down to 0% when idle.

npm install [email protected]

-    "fsevents": "^1.2.12",
+    "fsevents": "^2.3.2",

[chrisfcarroll]

( I wonder if there are multiple issues involved. It seems to me that npm install triggers heavy CPU usage by mds_stores )

[eliozashvili]

UPDATE: I used the "fsevents" approach suggested by @danvk and it seemed to work for a few minutes, but then my CPU shot back up to 130% - 160% consistently for the node process. I then uninstalled the "fsevents" package from the project and tried @LvChengbin approach of updating my webpack config to set "watchOptions" to ignore nodeModules. I also set it to "poll" every second:

watchOptions: {
     poll: 1000,
     ignored: ["node_modules"]
}

Doing this has dropped my CPU usage for the node process to around 15% consistently now and has resolved my issue. I then reduced the "poll" frequency to 5 seconds(5000ms) instead of 1(1000ms) second and my CPU is consistently around 4% for the node process.

The approach originally suggested by @LvChengbin should be the correct answer to this issue and doesn't involve adding any new packages to your project.

how can I install that watchOptions? or where should I write that code? :(