How to deal with memory overflow in angularjs

This time I will bring you how to deal with memory overflow in angularjs, what are the precautions when dealing with memory overflow in angularjs, the following is a practical case, let's take a look.

This time I will show you how to deal with angularjs memory overflow, and what are the precautions for dealing with angularjs memory overflow. The following is a practical case, let's take a look.

70% building modules 1345/1345 modules 0 active

ms: Mark-sweep 703.9 (837.9) -> 701.4 (811.9) MB, 331.3 / 0 ms [allocation failure] [GC in old space requested].
ms: Mark-sweep 701.4 (811.9) -> 701.4 (790.9) MB, 350.5 / 0 ms [allocation failure] [GC in old space requested].
ms: Mark-sweep 701.4 (790.9) -> 698.0 (760.9) MB, 433.7 / 0 ms [last resort gc].
ms: Mark-sweep 698.0 (760.9) -> 692.7 (751.9) MB, 328.7 / 0 ms [last resort gc].

==== JS stack trace =========================================
Security context: 00000298510373A9 <js>
  1: /* anonymous */(aka /* anonymous */) [D:\dev\cobalt_wp\node_modules\webpack\lib\FlagDependencyExportsPlugin.js:77] [pc=0000026F721B51D6] (this=0000029851004131 <undefined>,dep=00000150FC6162C9 <a>)
  2: arguments adaptor frame: 3->1
  3: InnerArrayForEach(aka InnerArrayForEach) [native array.js:~924] [pc=0000026F71EE3DCD] (this=000002985100413...
FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - process out of memory</a></undefined></js>

Note: The code here is not my actual error code. The compilation time was too long and I forgot to intercept it. The general error is basically the same. If you encounter the same problem, congratulations. See below. Found the answer!

I was confused at the time, the compilation was always going well, why did it suddenly overflow?

The possible reasons are as follows:

1. When compiling angular4, the demand for CPU and memory is relatively large. When the number of files is large, there may be insufficient memory (possibly);

2. When the code has a large amount of big data loops Or an infinite loop (there is no overflow in the sever stage, this probability should be low);

3. The data subscribed by angular is not destroyed in the ngOnDestroy stage, causing a large amount of data to occupy memory (possible)

Currently we have not found out what is the specific cause. If anyone knows, please feel free to enlighten us. Thank you!

The process of solving this problem is very twists and turns, so I won’t go into it here. You probably don’t want to know either. , let’s talk about the solution below:

The core idea is to use the old attributes of the v8 engine : --max_old_space_size to modify the memory online. As for where to set this attribute, it is a tedious task. Little goblin!

Modify directory: my-project/node_modules/.bin Find ng.cmd:

@IF EXIST "%~dp0\node.exe" (
 "%~dp0\node.exe" --max_old_space_size=8192 "%~dp0\..\._@angular_cli@1.0.0@@angular\cli\bin\ng" %*
) ELSE (
 @SETLOCAL
 @SET PATHEXT=%PATHEXT:;.JS;=;%
 node --max_old_space_size=8192 "%~dp0\..\._@angular_cli@1.0.0@@angular\cli\bin\ng" %*
)

Modify directory: my-project/node_modules/.bin Find ngc.cmd:

@IF EXIST "%~dp0\node.exe" (
 "%~dp0\node.exe" --max_old_space_size=8192 "%~dp0\..\._@angular_compiler-cli@4.0.1@@angular\compiler-cli\src\main.js" %*
) ELSE (
 @SETLOCAL
 @SET PATHEXT=%PATHEXT:;.JS;=;%
 node --max_old_space_size=8192 "%~dp0\..\._@angular_compiler-cli@4.0.1@@angular\compiler-cli\src\main.js" %*
)

Have you seen the --max_old_space_size setting in it? As for how much the number should be set, you can decide it yourself. My project is relatively large, so I set a larger value to prevent accidents, haha!

Then execute ng build --prod, do you think this is enough? This is the key point!

I personally tested it, with the above settings, and then executing the compilation, a memory overflow will still be reported, which seems to be inconsistent. It’s of no use! Switch the current directory to my-project/node_modules/.bin and then execute ng build --prod. The world will suddenly be at peace! I personally tested it and it works, so I’ll keep it!

If you I want to ask, why not add --aot? I'll leave this to you to think about first!

Okay, I'll take some time out from my busy schedule to share how to fill this big hole. I hope it will be useful to everyone!

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to the php Chinese website Other related articles!

Recommended reading:

vue2.0 uses swiper to implement carousel advertising

How to implement scroll scrolling on the mobile side in vue

The above is the detailed content of How to deal with memory overflow in angularjs. For more information, please follow other related articles on the PHP Chinese website!