I am struggling with an issue where on running any angular app locally the node process linked to
ng serve is using well over 100% of my CPU core’s.
My current environment is:
Angular CLI: 7.3.10
OS: darwin x64 (Mac OS X Catalina 10.15.4)
I have come across numerous posts and issues about this where the common solutions appear to be to install
fsevents for Mac OS issues.
Things I have tried:
- Installing XCode Command Line Tools for
node-gyp to rebuild
fsevents after its installed
- Install the latest version of
fsevents (2.1.3) as an older version is specified as an optional dependency with angular-cli (1.2.13)
- Using a different node version, tried 12.13.0 and deleting node_modules and doing a clean install. Also tried latest fevents version again
- Incase its relevant I use
- Upgrading one of my apps from Angular 7 to 9, still same behaviour after clean install of dependencies, ensuring fsevents is installed and trying latest version too
No matter what I try, I keep observing high cpu usage, I have seen it creep up too 300-400% at times.
This is really hampering my development and I am hoping someone may have some bright ideas I could try out.
Failing that, I am wondering if I should try uninstalling
node completely, getting rid of
nvm and starting from scratch.
UPDATE – SOLVED
So I went down the route of removing
node off my machine and installing the latest stable version from nodeJS website.
Doing this made no difference when starting up my apps.
I came across a few posts talking about webpack’s polling behaviour and options to turn this off or to increase the amount of the polling interval.
I found there is a
--poll [ms] cli argument that can be used to control this frequency when
ng serve is at play.
--poll 1000 arg, I now have two of my apps running, with each one using around 30% of my cpu. So way lower than I have been observing lately but I wanted to see if I could this down lower.
--poll 2000 arg, I now see the node processes for these apps only using around 10-15%.
When detecting changes and recompiling the CPU usage spikes, which I would expect and then drops back to these lower levels.
So for whatever reason
fsevents is having no effect on my machine, it’s still being installed when
npm i my app dependencies, and I have installed it globally in case this a difference.
Anyway, I’m happier now, albeit I wish I understood why this problem occurred in the first place!
In Angular development context; transpilation/compilation causes CPU spike. When this happens too frequent, your system is in trouble.
There are certain ways to relieve the pain a little;
- Turn off file change detection / live-reload / auto compilation entirely
ng serve --live-reload false or
ng serve --no-live-reload etc. depending on your Angular CLI version
- Have a better change detection, react only when really needed
npm install fsevents
npm rebuild fsevents
- Forget change detection, check changes based on a time interval
ng serve --poll [ms]
CPU management is tricky, there can be many reasons for this problem. These are only a few possibilities closely related to Angular development. I hope this answer provides some options to try to the ones having the same trouble.
it seems i managed to resolve the problem:
delete the /node_module and install again
in my case that helped
i found the advise here:
Try using below command
node --max_old_space_size=8048 ./node_modules/@angular/cli/bin/ng serve