Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

High CPU usage while running on OS X #293

Closed
dceddia opened this issue Jul 29, 2016 · 31 comments
Closed

High CPU usage while running on OS X #293

dceddia opened this issue Jul 29, 2016 · 31 comments

Comments

@dceddia
Copy link
Contributor

dceddia commented Jul 29, 2016

After running npm start, the node process consumes ~40% CPU on my machine:

activity_monitor__all_processes_

I found that setting a polling interval in the the WebpackDevServer helped:

new WebpackDevServer(compiler, {
    historyApiFallback: true,
    hot: true, // Note: only CSS is currently hot reloaded
    publicPath: config.output.publicPath,
    quiet: true,

    // added this:
    watchOptions: {
      poll: 1000
    }
  })

Here were the settings I tried, and the resulting CPU usage:

poll: 1000  =>  4-6% CPU
poll: 500   =>  8-10% CPU
poll: 250   =>  14-16% CPU

There's a tradeoff between CPU usage and how snappy the dev experience feels. To me, 1000ms felt sluggish, but 500ms felt pretty good. I couldn't discern much difference between 500ms and 250ms.

It seems like adding some kind of polling interval would be a good idea to reduce the CPU usage.

@gaearon
Copy link
Contributor

gaearon commented Jul 30, 2016

I wonder if we should just do something like this: https://github.com/researchgate/webpack-watchman-plugin

@gaearon
Copy link
Contributor

gaearon commented Jul 30, 2016

Does webpack always use poll mode? Or only when it couldn’t use fsevents? Or are these two unrelated things?

@dceddia
Copy link
Contributor Author

dceddia commented Jul 30, 2016

That's a good question. As far as I can tell poll defaults to true, which apparently means "poll like crazy". It also seems to watch everything in node_modules by default -- adding this ignore line cuts CPU usage to near-zero, even while leaving poll at its default setting:

watchOptions: {
  ignore: /node_modules/
}

I'm not sure if this is a good idea, since I noticed that webpack.config.dev.js has a few loaders that seem to depend on paths.appNodeModules, which I assume is the node_modules directory?

As another data point, my wife also has a Mac and hers doesn't exhibit the high CPU usage while running npm. Different version of OS X (10.9 instead of 10.10) but I'm not sure what else is different.

Update: I'm also sad to report that node has stopped showing high CPU usage on my machine now, too. Sad because... what changed?

@gaearon
Copy link
Contributor

gaearon commented Jul 30, 2016

Hmm we definitely don't want to watch node_modules (even though we allow importing CSS from them). If we do, it's an issue and we need to fix it.

@gaearon
Copy link
Contributor

gaearon commented Jul 30, 2016

I'll accept a PR adding ignored (not ignore by the way) to watcher settings. webpack/watchpack#23

@gaearon
Copy link
Contributor

gaearon commented Aug 1, 2016

This was fixed by #294.

@gaearon gaearon closed this as completed Aug 1, 2016
@gaearon
Copy link
Contributor

gaearon commented Aug 1, 2016

This should be fixed in the new version. Can you please verify?
Please find the upgrade instructions here.

@gaearon gaearon added this to the 0.2.1 milestone Aug 1, 2016
@dceddia
Copy link
Contributor Author

dceddia commented Aug 1, 2016

Just tried it: node CPU usage now hovers between 0.1 and 0.2% 👍

@shauntrennery
Copy link

Seems to be a problem again with Node 7.0.0 and 7.1.0. macOS Sierra reporting CPU usage of 110% during "npm start" operation.

@ggregoire
Copy link

ggregoire commented Nov 16, 2016

Can confirm here.

I updated from node 6.8.1 to node 7.1.0 yesterday and now the node process consumes 100% CPU on my machine.

screen shot 2016-11-16 at 15 40 02

I didn't find anything relative to CPU usage and node 7 in Webpack issues.

I'm on El Capitan + latest version of CRA.

@gaearon @dceddia Should we reopen the issue or create a new one?

Edit: For those who have the same problem, you can downgrade with brew switch node x.x.x and list all the versions installed with brew info node.

@gaearon gaearon reopened this Nov 20, 2016
@gaearon
Copy link
Contributor

gaearon commented Nov 20, 2016

Let's reopen. Have you reported this to webpack? Can you confirm you have fsevents in node_modules?

@gaearon gaearon removed this from the 0.2.1 milestone Nov 20, 2016
@shauntrennery
Copy link

@gaearon I can confirm that I have fsevents in node_modules.

@dceddia
Copy link
Contributor Author

dceddia commented Nov 21, 2016

I'm seeing this too -- with node v7.1.0 on macOS Sierra, but not with node 6.9.1.

I tried putting back the poll option from back at the beginning of this issue, but it doesn't help quite as much as before...

no poll => 70-80% CPU
no poll, no ignored => 70-80% CPU
poll: 1000  => 10% CPU
poll: 500   =>  20% CPU
poll: 250   =>  36% CPU

It's almost as if the "ignored" line isn't working anymore. If I comment out that option, the CPU usage is not affected.

@gaearon
Copy link
Contributor

gaearon commented Nov 21, 2016

Worth filing a https://github.com/webpack/watchpack issue?

@dceddia
Copy link
Contributor Author

dceddia commented Nov 21, 2016

So, in a weird turn of events, I can no longer reproduce this. Using nvm w/ Node 7.1.0 and NPM 3.10.9, I installed create-react-app 0.6.0 and then did a create-react-app test. It installed fsevents correctly, and when I npm start, the CPU usage is fine.

However, about an hour ago, I was noticing that a fresh npm install would say something about "fsevents couldn't find binary, building..." -- but now, it downloads the binary for darwin-v51 just fine. Perhaps they just pushed it up...

Can anyone else confirm? Create a new project from scratch and see if the issue persists?

@jlubeck
Copy link

jlubeck commented Dec 2, 2016

I'm running into this issue and I don't see fsevents in my node_modules.

create-react-app 0.6.0
npm 4.0.2
node 7.2.0
macOS Sierra 10.12.2

CPU goes up to 140%, don't even know how that is possible!

@gaearon
Copy link
Contributor

gaearon commented Dec 2, 2016

Can you paste the full npm log after creating a fresh project?

@jlubeck
Copy link

jlubeck commented Dec 3, 2016

mmmm creating a fresh project and copying over the src files seems to have fixed the issue... I wonder why!

@jlubeck
Copy link

jlubeck commented Dec 3, 2016

I do see fsevents now as well... on the package.json, the only difference I see between old and new is react went from 15.4.0 to 15.4.1, in case it helps

@seidtgeist
Copy link

It seems that I have fixed the problem locally:

I removed my node_modules and yarn.lock, updated to [email protected] and now there is no CPU usage after the initial compilation.

I’m on node 0.7.2 with [email protected].

@gaearon
Copy link
Contributor

gaearon commented Dec 5, 2016

Have you readded yarn.lock back now?

@seidtgeist
Copy link

@gaearon Yes, I have re-added the yarn.lock created by a fresh install of my dependencies.

@gaearon
Copy link
Contributor

gaearon commented Dec 5, 2016

Closing then.
If you're having issues, try:

  1. Removing node_modules
  2. Updating react-scripts to the latest version in package.json (make sure you follow the migration instructions in changelog for every release you're skipping)
  3. Updating npm (npm i -g npm@latest) or Yarn (yarn self-update)
  4. Running npm install (or yarn)

@yuzhakovvv
Copy link

We had a deprecated version of fsevents in yarn.lock.

  1. rm -rf node_modules/
  2. Delete yarn.lock
  3. yarn (creates yarn.lock with the latest version of fsevents)

@ravilution
Copy link

I am sorry guys. Because of this issue, I am seriously thinking of setting up my own workspace. This is not helping development speed in any way.

@wiesson
Copy link

wiesson commented Jul 9, 2018

@ravilution which version of Node do you use?

@ravilution
Copy link

@wiesson 10.5.0. By the way, I have setup React + Parcel with all the features from CRA. It is blazing fast. I love it.

@savants
Copy link

savants commented Aug 16, 2018

@nedislavd
Copy link

I'm having the same issue in the last few days,
Running node v10.5.0 and npm 6.1.0 on Win10 x64

I've already tried:

  • removing /node_modules and doing a yarn install
  • adding a poll inside the watchOptions but neither worked.

Any ideas how to resolve this issue?

@coopersamuel
Copy link

@nedislavd If you recently upgraded to Node 10, you may need to npm install fsevents or npm rebuild fsevents. Worked for me on Mac High Sierra, not sure if that's a fix for Windows though

@travisdetert
Copy link

Can confirm @savants link also fixed this for me on Mojave.

kaykayehnn added a commit to kaykayehnn/typescript-react-redux-boilerplate that referenced this issue Jan 1, 2019
@lock lock bot locked and limited conversation to collaborators Jan 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests