CODEWITHSUNDEEP
angular
user172902
user172902

Reputation: 3581

Angular 2 Production build file is large

I have just created a new angular app using "ng new appName" and put in some buttons (from ng-bootstrap). I wanted to try to deploy to aws to check it out. However, when I run ng build --prod, the one of the dist file (vendor.a9e57aafdd6abc88b94a.bundle.map) generated is 7.7mb. Here is a screen shot of the files. What is the best way to resolve this issue so the user does not have to download that big of a file upon load?

screen shot

Upvotes: 5

Views: 2720

Answers (2)

unos baghaii
unos baghaii

Reputation: 2679

How To Keep Angular Deployment Size Small :

Take a look at the structure of my project .

Home page size is 922kb . demo

Upvotes: 2

Poul Kruijt
Poul Kruijt

Reputation: 71891

You are showing the file size of a .map file. A mapping file is used to let for instance the browser development tools map your compiled javascript to separate typescript files, which makes debugging easier. You've build this with a slightly older version of angular-cli. If you do not want these sourcemaps just build with a --no-sourcemap option, or upgrade to the latest version, where --prod will automatically disable sourcemapping. This will also greatly increase build times.

For a production build you only need your index.html, the css and js files, and your assets folder (+ favicon). If you manage to set up your webserver even better to serve static gzip files, you can even just place the js.gz and css.gz files on your webserver, and these will be served, which will increase performance even more.

Your users will not download a sourcemap file, unless you place it there, and they open up their browser console. This will give them insight in how you build your app. This can be unwanted

Upvotes: 10

Related Questions