There has been much talk and hype around Angular Ivy, with it being hailed as the saviour for many things that will come to Angular ecosystem of the future, this includes to be able to lazily load an individual component at runtime using the import syntax without the need of a NgModule itself.

this.foo = await import(`./foo.component`)
 .then(({ FooComponent }) => FooComponent);

Netanel Basal wrote an excellent post on this topic covering all the in’s and out’s on lazy loading individual components and how to use them (see link below).

Why do we want this at all? What’s all the fuss?

If you take the dashboard of a typical administration application. There are many differing aspects mostly displaying of analytical data to the user and each one of these panels can be components from various modules, but how to load these on demand or even how can the panel be customised by the end user themselves and dynamically loaded.

#angular #lazy-loading #outlet #portal #components