Ask HN: Why this bloat in Angular?

8 pointsavighnay7y ago15 comments

Why does each raw skeletal app generated by Angular need 240Mb of disk space and contains around 32 thousand files 239Mb in the node_modules folder.

If Angular is already global, why does it need all these files? And what are they doing?

Disclaimer: I am an old timer and really miss the just 'download and unzip' days of javascript and open source

8 pointsavighnay7y ago15 comments

Why does each raw skeletal app generated by Angular need 240Mb of disk space and contains around 32 thousand files 239Mb in the node_modules folder.

If Angular is already global, why does it need all these files? And what are they doing?

Disclaimer: I am an old timer and really miss the just 'download and unzip' days of javascript and open source

15 comments

14 comments · 7 top-level

superasn7y ago· 3 in thread

It's just how it is. You would find this article particularly insightful (1). An excerpt from it:

> It’s true. Each installation of Babel includes a picture of Guy Fieri, and there is nothing you can do about it.

(1) https://medium.com/@jdan/i-peeked-into-my-node-modules-direc...

avighnayOP7y ago

Thank you, this really says it! But why is the community still accepting it?

superasn7y ago

By the way you can run 'yarn autoclean' which creates a autoclean file that deletes useless stuff, tests, etc to free up some disk space.

hcho7y ago

Because disk space is cheap.

fiiv7y ago· 3 in thread

You're likely seeing a lot of the build tooling. Things to convert (from Typescript/etc to plain JS), bundle (optimised files for prod) and run the dev environment (static file serving, possibly from memory and not disk, not sure off the top of my head).

avighnayOP7y ago

Would that not be in the global Angular module install? why repeat per app folder?

fiiv7y ago

I am not sure about the specifics of Angular (I hate it), but in this sense it is similar to other frameworks of the time.

Vue, React, etc all use a transpiler to turn their code into code compatible with as many browsers as possible. The end result is that the syntactic sugar and niceties of the more modern JS specs get removed and replaced with their older counterparts. A popular tool for this is Babeljs.io

Modules themselves are new in browsers as well, so what actually tends to happen is that they don't just all get concatenated and use global variable scope but a module essentially becomes an enclosure, and all the enclosures are linked to one another at compile time. So there is usually no global variable called "Angular".

So if you generate an Angular app with their CLI, they pre-install all those build steps (along with Typescript, minification, etc). You get Angular using the transpiled module system out of the box.

bbcbasic7y ago

Incase you want different versions per app

avighnayOP7y ago· 1 in thread

This article echoes what I felt and here it is compared against Angular 1 itself

https://medium.com/dirtyjs/why-angular-2-4-5-6-sucks-afb3656...

danieka7y ago

Points 2, 3 and 4 I can agree with but the first point, about Typescript adding bloat but no value, I think is totally wrong.

Sure, TS is a new language, but if you use ES6 the difference is not that big. And the "drawback" "to have an IDE for checking errors", that's a win in my book.

No matter how large or small the application type-checking and a more structured programming language is invaluable. Also, not having to wonder about what JS function will work in what browser.

Sure, for a simple app Angular might not be optimal, but if you're building anything substantial it is invaluable.

quantummkv7y ago

It mostly boils down to the fact that javascript/nodejs does not ship with a standard library like every other language does. So every project has to include its own copy of what passes as the standard library (A random smattering of npm modules).

A casual peek into your node_modules folder will reveal packages such as left-pad, is-number, is-array etc. Stuff that is pre packaged into the runtime of any sane language. That's what makes up most of the bulk in any nodejs project.

romanovcode7y ago

It's not related to Angular, it's just how modern frontend works now. Also when you build it with production it won't be 240mb. Remember that it loads all dependencies as well as many build dependencies.

In fact Angular team is working on new view engine (ngIvy) that shown to tree-shaken "Hello World" angular application down to 2.6kb.

IMO your reasoning for complaining is ridiculous, it's like saying "I hate C#, why do I need to download 6gb Visual Studio that has 64 thousand files in "Program Files/Visual Studio" folder to build C# application!".

avighnayOP7y ago

Found this article on setting up Angular with minimal dependencies

https://blog.angularindepth.com/setting-up-angular-from-scra...

[edit] this does not work well with Angular 6 and also it reduces dependencies only to 100Mb

muzani7y ago

Because it appeals to the demographic who uses it. Power at the cost of size and weight.

If you care a lot about size, you could use something like Vue.

j / k navigate · click thread line to collapse

15 comments

14 comments · 7 top-level

superasn7y ago· 3 in thread

It's just how it is. You would find this article particularly insightful (1). An excerpt from it:

> It’s true. Each installation of Babel includes a picture of Guy Fieri, and there is nothing you can do about it.

(1) https://medium.com/@jdan/i-peeked-into-my-node-modules-direc...

avighnayOP7y ago

Thank you, this really says it! But why is the community still accepting it?

superasn7y ago

By the way you can run 'yarn autoclean' which creates a autoclean file that deletes useless stuff, tests, etc to free up some disk space.

hcho7y ago

Because disk space is cheap.

fiiv7y ago· 3 in thread

avighnayOP7y ago

Would that not be in the global Angular module install? why repeat per app folder?

fiiv7y ago

I am not sure about the specifics of Angular (I hate it), but in this sense it is similar to other frameworks of the time.

So if you generate an Angular app with their CLI, they pre-install all those build steps (along with Typescript, minification, etc). You get Angular using the transpiled module system out of the box.

bbcbasic7y ago

Incase you want different versions per app

avighnayOP7y ago· 1 in thread

This article echoes what I felt and here it is compared against Angular 1 itself

https://medium.com/dirtyjs/why-angular-2-4-5-6-sucks-afb3656...

danieka7y ago

Points 2, 3 and 4 I can agree with but the first point, about Typescript adding bloat but no value, I think is totally wrong.

Sure, TS is a new language, but if you use ES6 the difference is not that big. And the "drawback" "to have an IDE for checking errors", that's a win in my book.

No matter how large or small the application type-checking and a more structured programming language is invaluable. Also, not having to wonder about what JS function will work in what browser.

Sure, for a simple app Angular might not be optimal, but if you're building anything substantial it is invaluable.

quantummkv7y ago

romanovcode7y ago

In fact Angular team is working on new view engine (ngIvy) that shown to tree-shaken "Hello World" angular application down to 2.6kb.

avighnayOP7y ago

Found this article on setting up Angular with minimal dependencies

https://blog.angularindepth.com/setting-up-angular-from-scra...

[edit] this does not work well with Angular 6 and also it reduces dependencies only to 100Mb

muzani7y ago

Because it appeals to the demographic who uses it. Power at the cost of size and weight.

If you care a lot about size, you could use something like Vue.

j / k navigate · click thread line to collapse