DEV Community

Cover image for Make your Angular App faster using Dynamic import
mridul037
mridul037

Posted on

Make your Angular App faster using Dynamic import

Tips to make your angular app faster:

while importing your module using lazy loading helps

{ π‘π‘Žπ‘‘β„Ž: 'β„Žπ‘œπ‘šπ‘’', π‘π‘œπ‘šπ‘π‘œπ‘›π‘’π‘›π‘‘: π»π‘œπ‘šπ‘’πΆπ‘œπ‘šπ‘π‘œπ‘›π‘’π‘›π‘‘;}

To using loadChildren:

{π‘π‘Žπ‘‘β„Ž: 'β„Žπ‘œπ‘šπ‘’', π‘™π‘œπ‘Žπ‘‘πΆβ„Žπ‘–π‘™π‘‘π‘Ÿπ‘’π‘›: './β„Žπ‘œπ‘šπ‘’/β„Žπ‘œπ‘šπ‘’.π‘šπ‘œπ‘‘π‘’π‘™π‘’#π»π‘œπ‘šπ‘’π‘€π‘œπ‘‘π‘’π‘™π‘’'}

to make even better use dynamic import() function in Javascript.

{
π‘π‘Žπ‘‘β„Ž: 'β„Žπ‘œπ‘šπ‘’',
π‘™π‘œπ‘Žπ‘‘πΆβ„Žπ‘–π‘™π‘‘π‘Ÿπ‘’π‘›: () => π‘–π‘šπ‘π‘œπ‘Ÿπ‘‘('./β„Žπ‘œπ‘šπ‘’/β„Žπ‘œπ‘šπ‘’.π‘šπ‘œπ‘‘π‘’π‘™π‘’').π‘‘β„Žπ‘’π‘›(π‘š =>
π‘š.π»π‘œπ‘šπ‘’π‘€π‘œπ‘‘π‘’π‘™π‘’)
},

import statement return a promise. you read more about in given link.

link:: https://javascript.info/modules-dynamic-imports

Discussion (0)