Angular 4 main bundle is very huge (What is $_gendir?)

Question

I have created a web application with Angular 4. In that after aot compiling main bundle size is more than 700 KB. There is something called $_gendir and app in main bundle (Saw it in source map explorer). Can someone please explain about those?

Note : When i use --no-aot, main bundle size is 426 KB only.

Command used : ng build --base-href /rising/ --aot --prod --build-optimizer --vendor-chunk=true --sourcemaps --named-chunks --output-hashing=false

Answer 1

The image you shared shows it comes from the src folder, so I'm a bit confused. Although been a while since I've checked the source map explorer and I guess the internals of the cli have changed. Also it's >700KB not MB :). Big difference of a factor 1000 there.

Anyways, Ahead of Time is not a tool to reduce your bundle size. It's something to greatly reduce rendering time of the application and increase the overall speed a lot.

Generally speaking, at first your application will be smaller with AOT, but the bigger your application grows, you will reach a point that AOT will be bigger than JIT. I suppose you've reached that point!