Ionic 4 bundle size (ionic-angular)

What should the expected app size be with Ionic 4 with Angular? Since it’s supposed to be great for building PWAs, bundle size matters a lot.

When I’m doing a prod build of a blank 4.0.0-rc.0 “sidemenu” app, the Chrome developer tools shows 676kb downloaded on app startup.

What are the recommended ways to shrink the size of the app on first load? Do I have to ditch Angular?

(The build is done using --prod with 4.0.0-rc.0. A blank starter template generated by the CLI.)

I’m agree it’s really important that app are the smallest as possible, specially the one published in store. But what’s even more important I think is that every thing is lazy loaded, consumed only when needed, loaded in the background after the first page load etc. summarized, it’s important to have a good Lighthouse score :wink:

I’m curious about it, could you link the url to have a look? Or display screenshots of the resources and “the waterfall” of the downloaded resources?

I think anyone will have the same result. A new blank starter app of the type “sidemenu”. Do a prod build, serve it using a webserver, and load in Chrome and check the networks tab. (At the very bottom of the screenshot you see 677kb)

My understanding, correct me if it’s wrong, that’s the overall size including the elements which are then loaded in the background respectively not the size which was needed for the rendering of the page and its first elements to allow the user to interact with the page, but again correct me if’ that’s wrong

Yes this is including anything that’s loaded in the background. But this is the total size for just loading the HomePage, meaning any visitor to the site must download 677kb at a minimum.

Do you notice any particular file bigger than the other?

I checked my app (ionic v4 angular pwa) and also observe that kind of size, but I’ve got styling, images etc. so it kind of makes sense. I checked my other PWA, build with the Ionic v4 PWA toolkit (no angular), that one is load around 300kb