Ionic - Understanding Lazy Loading

Working with ionic 3 I am finally implementing lazy loading into my apps. I have a theoretical question on performance which applies to both Ionic 3/4.

Hypothetically say I have 3 pages:




all of which are lazy loaded.

In addition say I have a modal page called:


This modal page is size 1.5mb.

Assume ModalPage is used in Page 1 and Page 2 and included in the respective module.ts for each page (not in app.module).

My question is:

  1. When I load the app and I open page1 first and then push page 2 onto the stack. As ModalPage is not global and imported separately for page 1 and page 2. Does this mean my app when I open page1 will lazy-load & download the 1.5mb Modal Page and then again another instance of modal page @ 1.5mb when I push page 2 onto the stack? So in total I am downloading 3mb worth of code?

  2. If above is true apart from downloading issues is there any other impact on performance? ie having multiple instances of components/pages loaded via page modules instead of globally importing the component/pages once into the app.module