Hacker News Reader

Comment by Zikes | Hacker News Reader

177 modules for a Hello World page? Is this satire?

Most of the modules involved are development side resources that don't end up included in the build. Complaining about the number of modules is like installing visual studio, noticing that it takes several gigs on disk and being like "Gigabytes, for a hello world program?"

Sigh, that's an absurd way to measure. A "Hello world" is just that: a demo. No-one is:

1) actually making Hello, World pages that will go anywhere near a user

2) Using React in Hello, World pages (which they don't make)

3) Using Reactpack to build the React-based Hello World pages they aren't making

It's not absurd because:

1) Whatever you're making, you're starting out with 177 modules minimum if you use React + Reactpack.

2) See 1.

But if you're using React you are creating a not-insignificant webapp and the initial install time of 177 modules is totally irrelevant beyond that first install. It doesn't have any reflection on the size of the client JS file (webpack loaders, for example, only live on the dev machine).

Moreover, you can presumably globally install this, so it can cover every React-based project you need to build.

What is an acceptable number of modules?

Surely the important bit is the size of the code that's served to the end user, not the size of the development environment?

My Visual Studio install is easily at least 4GB, yet this doesn't matter to the end user as the packages produced are about 6MB total

That's Node, baby. Deal with it.

It's just an example to show what type of code `reactpack` builds, ES6 and JSX with style loading in this case. If you want a more minimal React-like build you can switch out React with lightweight alternatives like Preact or React-lite.

For reference, I build a standalone datepicker module with preact + redux at under 20kb (min + gz)... worked out really well. By comparison, went with regular react recently, and the payload quickly got over 200kb, though I needed a couple relatively heavy libraries for the app in question.

Another point worth mentioning is using react-icons individually (svg based), same for component libraries where you are only using a few components... tends to work out much lighter. Also, if you do use bootstrap as a base css library, work from the source instead of monkey patching the .css output.

Reply on news.ycombinator.com