Lazy loading is a one of the most powerful 💪 feature to strengthen Angular application performances.

As component additions progress, the Angular app gets bigger and heavier. 🪨

Then, at some point, the app takes so much time to load (3s, 4s...) that users leave it. ☹️

There, lazy-loading enters the game 🧑‍🎤 by loading a module only if the user need it (when he goes to the related URL),

so if the user does not browse the URL of a module, that app does not load the module linked to that URL 🦸‍♂️.

𝐇𝐞𝐫𝐞 𝐚𝐫𝐞 𝐭𝐡𝐞 𝐚𝐝𝐯𝐚𝐧𝐭𝐚𝐠𝐞𝐬 𝐨𝐟 𝐥𝐚𝐳𝐲-𝐥𝐨𝐚𝐝𝐢𝐧𝐠:

👉 The initial application loading is by far faster ⏩ , because you only load a module rather than all the app modules.

👉 You can load features on demand 🙏 . You accelerate that way the loading time for the users going only on some parts of the app.

👉 You can add new features without slowing down the whole app (consuming network bandwidth ⚡ only for the feature module, while a monolith app would consume wider bandwidth for all the features at the same time)

👉 This forces you to better architect 🗺️ your app, because all asynchronous routes (URL) are based on lazy-loading. You have consequently to cut ✂️ your app, by grouping each feature in a module.

𝐒𝐨 𝐥𝐚𝐳𝐲-𝐥𝐨𝐚𝐝𝐢𝐧𝐠 𝐢𝐦𝐩𝐫𝐨𝐯𝐞𝐬 𝐩𝐞𝐫𝐟𝐨𝐫𝐦𝐚𝐧𝐜𝐞𝐬, 𝐚𝐧𝐝 𝐢𝐭 𝐢𝐬 𝐭𝐡𝐞 𝐟𝐢𝐫𝐬𝐭 𝐛𝐞𝐬𝐭 𝐩𝐫𝐚𝐜𝐭𝐢𝐜𝐞 𝐚𝐜𝐜𝐨𝐫𝐝𝐢𝐧𝐠 𝐭𝐨 𝐆𝐨𝐨𝐠𝐥𝐞 𝐭𝐨 𝐬𝐩𝐞𝐞𝐝 𝐮𝐩 𝐲𝐨𝐮𝐫 𝐚𝐩𝐩.