After deployed ng build --prod dist folder
I'm using angular 6 and lazy loading module with "CustomPreloadingStrategy" and enabled GZIP compression. with reference link need to decrease bundle js files.
ng serve --prod (initial load page finish less than 3 seconds)
chunk {1} main.e15dbe5b36838602da7f.js (main) 1.18 MB [initial] [rendered]
chunk {5} vendor.f69386968aafba8d79d3.js (vendor) 2.24 MB [initial] [rendered]
ng build --prod (initial load page finish less than 15 seconds) so need to finish initial load page below 3 seconds
I have huge project file more than 50 MB file size so after deployed with ng build --prod it's comes 10 MB.
chunk {1} main.ea8033fd76e2ff3ea29d.js (main) 3.28 MB [initial] [rendered]//after ng build --prod main.js file more than 3.28 MB so need to decrease size of bundle size.
chunk {4} 4.f621cfb9a654b1c82a9f.js () 1.53 MB [rendered]
tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"module": "es2015",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2017",
"dom"
]
}
}
angular.json //here I have production environment path
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true
}
}