me-12 / single-spa-portal-example

Example project on how to combine multiple SPA's on a single Website
MIT License
407 stars 136 forks source link

Production build in angular #34

Closed ssi-hu-tasi-norbert closed 6 years ago

ssi-hu-tasi-norbert commented 6 years ago

Hello,

I've just tried the build and it seems it is too big for angular apps.(500kb). Could you add an example how to run the built version on node.js for example?

Thank you for your help

Norbert

me-12 commented 6 years ago

I have merged a PR that does decrease the size limit a little bit. I have changed the typescript compiler to output "es2015" instead of "commonjs". This is the same setting as it is with a default Angular CLI project.

The size is now down from 550kb to 450kb. This does still seem to be big, but you have to take this in perspective to a angular CLI project.

Default size of a new generated Angular CLI project is:

Angular: ~143kb rxjs: ~12kb polyfills: ~58kb total: ~213kb total gziped: ~63kb

image

Now look at the single-spa-portal-example build:

Angular: ~217kb rxjs: 120kb (angular redux aparently uses many more features from rxjs) Angular router: ~80kb angular-redux: ~8kb few other small libs: ~25kb total: ~450kb total gzipped: ~112kb

image

Summarized you can say that single-spa-portal-example apps are a bit bigger but your default Angular app will also grow in size as you add features like routing or rxjs. Also keep in mind that you can configure your webserver to serve gzipped content. Which means the app will only be 112kb in size. This is smaller than most pictures you have most likely multiple of on your website.

me-12 commented 6 years ago

Could you add an example how to run the built version on node.js for example?

Just jump into the app folder you want to build and type: "npm run build:portal".

ssi-hu-tasi-norbert commented 6 years ago

Thank you! Indeed it works.

Could you add an example how to run the built version on node.js for example?

I've just wanted to know how to run the production build and I've created a server.js under node.js which is serve the built js as a static resource and with compression its size is as about you wrote above. So if I am right the apps can be served by cdn which is a preferred way for us.

Thank you very much!

me-12 commented 6 years ago

So if I am right the apps can be served by cdn which is a preferred way for us.

Yes anything that can serve static assets will do. :)