Reducing webpack file (index.js) size for loading

[poojaparasharam]

I wanted reduce webpack file size using code splitting, now my webpack file (index.js) size is around 5 MB.
As i tried using lazy loading , code splitting but still my file size is same.

[tony-shannon]

Can you please clarify the issue..
thanks
Tony

[poojaparasharam]

When we build webpack , the file (index.js) size is around 5 MB because i am loading every module in the initial page load. So i wanted to reduce this 5 MB to around 1 MB.

[tony-shannon]

thanks @poojaparasharam

@kbeloborodko could you reply to this when you get a chance please?
I understand there has been work done on this

[kbeloborodko]

@poojaparasharam could you please clarify what steps have been taken to introduce code splitting?
@tony-shannon 5 Mb is the size of the build that has been already reduced (initially it was around 9 Mb) and we did not do code splitting within the Angular version. We have code splitting in the React version though.

[poojaparasharam]

Sorry for late reply.

In webpack entry point, index and vendor JS files are used for code splitting. index.js file is loading all components and vendor.js is loading third party packages(angular packages). when i build application, index file size is 4.8 MB ,and vendor file size 638 KB.

Now my requirement is to reduce index file size,because it's taking time to load application initially.

And one more help is needed, when i initially load application i want to load only patients list component , and if require or if we click on any patient then only load all modules component(vitals component, compliant component , etc),how can i achieve this in angularJS.

Please do needful help. Thank you.

[tony-shannon]

@poojaparasharam Do you have any ideas as to how to make any of these improvements yourself?

This is an open source project... so its about give as well as take :o)