Skip to content

Question: Low performance with Native Federation #559

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
ips219 opened this issue May 13, 2024 · 17 comments
Open

Question: Low performance with Native Federation #559

ips219 opened this issue May 13, 2024 · 17 comments

Comments

@ips219
Copy link

ips219 commented May 13, 2024

After moving from webpack to native federation I've noticed that surprisingly I've worst perfomance in local dev server with vite and esbuild than previously with webpack.

I am making some tests and trigering the rebuild with an small change takes a long time to complete.

`
Changes detected. Rebuilding...
{
"added": [],
"modified": [.......],
"removed": []

No output file changes.

Application bundle generation complete. [1.258 seconds]

INFO Building federation artefacts
INFO Done!

`

The bundle generation takes just 1.2 seconds, but the "Building federation artefacts" takes almost 35 seconds each time I make any change.

Considering my previous branch wich is currently working with Angular17 and webpack module federation it takes 2.4 seconds
image

I guess I've some configuration wrong, but I've double checked the migration notes and the example and my angular.json is almost the same.
https://github.com/angular-architects/module-federation-plugin/blob/main/libs/native-federation/migrate-appbuilder.md
https://github.com/manfredsteyer/module-federation-plugin-example/blob/nf-standalone-starter/angular.json

Did anybody faced something similar?

Best regards.

@ips219
Copy link
Author

ips219 commented May 13, 2024

Adding some additional details, after digging in the builder...

Checking the method which is taking so long, build-for-federation:buildForFederation() it seems that most of the time is taken in the bundle-exposed-and-mappings:bundleExposedAndMappings() and bundle-shared: bundleShared().

Both of them internally call same method build-utils:bundle() which the one that takes 35/40 seconds to execute both calls.

@manfredsteyer
Copy link
Contributor

Thanks for this info.

Is it about ng serve or ng build?
Can you please share you package.json and your federation.config.js?

@ips219
Copy link
Author

ips219 commented May 14, 2024

Sure...

Thanks for your support...

info.zip

I've seen in the esbuild documentation that antivirus may affect the bundle process... I am not sure if this can be the source of the problem. Just in in case I will test also disabling the AV.

@ips219
Copy link
Author

ips219 commented May 14, 2024

After disabling the AV the performance improved a little bit but the bundle process still takes a long time to complete >20s (i added some logs).

`
Application bundle generation complete. [0.740 seconds]

INFO Calling bundleExposedAndMappings: Tue May 14 2024 10:14:35 GMT+0200
INFO Called bundleExposedAndMappings Tue May 14 2024 10:14:35 GMT+0200
INFO Calling bundle with 1 entrypoints Tue May 14 2024 10:14:35 GMT+0200
INFO Calling createBuildResultMap with 0 shared Tue May 14 2024 10:14:50 GMT+0200
INFO Adding 0 exposes Tue May 14 2024 10:14:50 GMT+0200
INFO Finished bundleExposedAndMappings Tue May 14 2024 10:14:50 GMT+0200
INFO Calling describeExposed: Tue May 14 2024 10:14:50 GMT+0200
INFO Calling bundleShared: Tue May 14 2024 10:14:50 GMT+0200
INFO Called bundleShared Tue May 14 2024 10:14:50 GMT+0200
INFO Calling bundle Tue May 14 2024 10:14:51 GMT+0200
INFO Bundle finished Tue May 14 2024 10:15:01 GMT+0200
INFO Files copied Tue May 14 2024 10:15:02 GMT+0200
INFO Calling describeSharedMappings: Tue May 14 2024 10:15:02 GMT+0200
INFO Calling writeFederationInfo: Tue May 14 2024 10:15:02 GMT+0200
INFO Calling writeImportMap: Tue May 14 2024 10:15:02 GMT+0200
INFO BuildFederation completed: Tue May 14 2024 10:15:02 GMT+0200
INFO Done!

`

@manfredsteyer
Copy link
Contributor

Thanks. I will try it out with your dependencies.

Just to make sure we are talking about the same: Do we speak about the first ng serve/ ng build or subsequent ng serve/ ng build calls?

The first time they are called, it indeed takes a bit longer because all the deps need to be compiled for federation. The result of this is cached in node_modules/.cache. After that, it should really be fast as the deps are not compiled anymore.

@ips219
Copy link
Author

ips219 commented May 14, 2024

I meant the subsequent calls...

I understand that the first ng serve takes longer as you said (cache generation...) but subsequent calls I expected to be lighweight.

In mfe + webpack once the dev server is running (ng serve) it takes up to 3s, now in mfe + native it is taking up to 35s to rebuild each developer change.

Best regards.

@dipu7388
Copy link

dipu7388 commented Jul 18, 2024

@manfredsteyer @jigfox we have large repository which also mono-repo library, using native federation build time for development/ production increased most time is consumed in Building federation artefacts. its taking around 1-2 minutes.
image

@manfredsteyer
Copy link
Contributor

Yes, that's possible, because building federation artifacts is an additional build step.

But it should not take longer than the original Angular-build (37 sec in this case). Can you try to nuke your .angular folder and compare both times again?

@ladler1
Copy link

ladler1 commented Dec 19, 2024

@ips219 could you solve the problem? I have a similar problem with long build times of federation artifacts

@livingplant
Copy link

We have the same issue.
In a nx Monorepo we have a angular build Time for a Microfrontend of 1-2 Seconds with vite and the federation artifacts take 10-20 Seconds. It also uses way more Ressources.
Has anyone solved this?

@rribeiro93k
Copy link

I have the same problem here, federation build time is too slow compared to angular build process. @manfredsteyer about this issue, we have some fix to solve? or still in analysis?

@livingplant
Copy link

Could this PR solve the Problem? #588

@livingplant
Copy link

@manfredsteyer any news here?

@rribeiro93k
Copy link

@manfredsteyer @rainerhahnekamp any news or suggestion?

@fpd007
Copy link

fpd007 commented May 15, 2025

As a workaround I currently use ng serve with the original builder for faster development of parts of the application that do not use federation.

I added a second npm script to run the app with federation, whenever I need it.

@ips219
Copy link
Author

ips219 commented May 15, 2025

Just for the records... I migrated from NG17 to NG19 and I made a new attempt migrating from webpack to native-generation...

But... same results as one year ago. It takes 30/40 seconds in the bundle generation... In my case I cannot consider have different set of scripts... the application will be very dififcult to maintain because of the different federated modules... I have not a mono-repo design and it will be a pain.

So for the moment I've to keep webpack (I hope it will not become deprecated in a near future).

@livingplant
Copy link

@manfredsteyer any news?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants