Angular Stats - ng build Vs ng build --prod

In this blog, we are going to explore the Angular application stats that will help us understand the usage of ng build options.

In this blog, we are going to explore the Angular application stats, which will help us understand the usage of ng build options.
 
Let's start with a sample application.
 
Here I'm going to use the same project, which I've used in my previous blogs. You can use any app you like. We're going to install webpack-bundle-analyzer.
 
Install the below package to check the Angular stats.
  1. npm install webpack-bundle-analyzer --save-dev  
Now, let us run the build command with --stats-json. It will create a json file in dist folder.
  1. ng build --stats-json  
Once the file is created, execute the below command to generate a visual representation of all .js bundle packages.
  1. npx webpack-bundle-analyzer dist/angular7Demo/stats.json  
It will popup a new window with all packages like this:
 
Angular Stats - ng build Vs ng build --prod
 
Angular Stats - ng build Vs ng build --prod
 
Check out the "Show chunks" area of files in the left side created by the ng build option and see the bundle size.
 
 Angular Stats - ng build Vs ng build --prod
 
You can check that each js file below is a main.js where you can see all components and their usages.
Angular Stats - ng build Vs ng build --prod
 
Now, let us build with --prod option. Run this command. 
  1. ng build --prod --stats-json  
 
 Angular Stats - ng build Vs ng build --prod
 
Check the results using Angular stats. You will see the results as something like this:

Angular Stats - ng build Vs ng build --prod
As you can see from the above file, --prod file size is much smaller.
 
Let's see the differences between ng build vs ng build --prod in the following table:
 
 ng build  ng build --prod
 environment.ts - will be used  environment.prod.ts
 source map will be generated  source map will not generate
 No Uglification  Uglification
 No Tree shaking  Tree shaking
 No AOT  AOT Enabled
 No Bundling  Bundling
 
I hope it helps!