Super slow HMR in meteor 3.0

I can confirm this for all my Meteor 3 + React + MUI projects.

Sorry, I cannot give a solution, but this just reminded me of my car that provided good emission results only when being tested for emission :rofl:

2 Likes

Meteor 3.0.3 + React 18 + MUI 5. It took ~7 seconds.

The Rebuild App step took only 500 - 700ms on my machine. But the time delay from above step took 4 - 5 seconds.

| (#6) Total: 0 ms (ProjectContext prepareProjectForBuild)
| 
| (#7) Profiling: Rebuild App

It took 4 - 5 SECONDS to jump from #6 to #7.

2 Likes

One common performance issue with the MUI library in Meteor is that @mui/icons-material is quite heavy. Importing it eagerly from the index makes the bundles and related processes larger, especially without using specific paths, a Babel import transformation plugin, or modern bundler tree shaking.

In your code I saw a line of code importing eagerly:

Try using import ListAltIcon from "@mui/icons-material/ListAlt instead, and see if the problem persist. Additionally, consider removing dependencies from the project one by one, then re-run it to identify which one is causing the issue.

If the problem continues, we’ll need to investigate it as part of our performance work. I’ve made some notes on this. Thanks for setting up the environment. We’ll follow up once we have more information.

1 Like

with --verbose --no-release-check options, I got this between #6 and #7:

Local package version is up-to-date: accounts-base@3.0.2
Local package version is up-to-date: accounts-password@3.0.2
Local package version is up-to-date: aldeed:collection2@4.0.3
Local package version is up-to-date: aldeed:simple-schema@1.13.1
Local package version is up-to-date: allow-deny@2.0.0
Local package version is up-to-date: autoupdate@2.0.0
Local package version is up-to-date: babel-compiler@7.11.0
Local package version is up-to-date: babel-runtime@1.5.2
Local package version is up-to-date: base64@1.0.13
Local package version is up-to-date: binary-heap@1.0.12
Local package version is up-to-date: blaze-tools@2.0.0
Local package version is up-to-date: boilerplate-generator@2.0.0
Local package version is up-to-date: caching-compiler@2.0.0
Local package version is up-to-date: caching-html-compiler@2.0.0
Local package version is up-to-date: callback-hook@1.6.0
Local package version is up-to-date: check@1.4.2
Local package version is up-to-date: core-runtime@1.0.0
Local package version is up-to-date: ddp@1.4.2
Local package version is up-to-date: ddp-client@3.0.1
Local package version is up-to-date: ddp-common@1.4.4
Local package version is up-to-date: ddp-rate-limiter@1.2.2
Local package version is up-to-date: ddp-server@3.0.1
Local package version is up-to-date: diff-sequence@1.1.3
Local package version is up-to-date: dynamic-import@0.7.4
Local package version is up-to-date: ecmascript@0.16.9
Local package version is up-to-date: ecmascript-runtime@0.8.2
Local package version is up-to-date: ecmascript-runtime-client@0.12.2
Local package version is up-to-date: ecmascript-runtime-server@0.11.1
Local package version is up-to-date: ejson@1.1.4
Local package version is up-to-date: email@3.1.0
Local package version is up-to-date: es5-shim@4.8.1
Local package version is up-to-date: facts-base@1.0.2
Local package version is up-to-date: fetch@0.1.5
Local package version is up-to-date: geojson-utils@1.0.12
Local package version is up-to-date: hot-code-push@1.0.5
Local package version is up-to-date: hot-module-replacement@0.5.4
Local package version is up-to-date: html-tools@2.0.0
Local package version is up-to-date: htmljs@2.0.1
Local package version is up-to-date: id-map@1.2.0
Local package version is up-to-date: inter-process-messaging@0.1.2
Local package version is up-to-date: launch-screen@2.0.1
Local package version is up-to-date: localstorage@1.2.1
Local package version is up-to-date: logging@1.3.5
Local package version is up-to-date: meteor@2.0.1
Local package version is up-to-date: meteor-base@1.5.2
Local package version is up-to-date: meteortesting:browser-tests@1.7.0
Local package version is up-to-date: meteortesting:mocha@3.2.0
Local package version is up-to-date: meteortesting:mocha-core@8.3.1-beta300.0
Local package version is up-to-date: minhna:connection-status-react@0.3.1
Local package version is up-to-date: minifier-css@2.0.0
Local package version is up-to-date: minifier-js@3.0.0
Local package version is up-to-date: minimongo@2.0.1
Local package version is up-to-date: mobile-experience@1.1.2
Local package version is up-to-date: mobile-status-bar@1.1.1
Local package version is up-to-date: modern-browsers@0.1.11
Local package version is up-to-date: modules@0.20.1
Local package version is up-to-date: modules-runtime@0.13.2
Local package version is up-to-date: modules-runtime-hot@0.14.3
Local package version is up-to-date: mongo@2.0.2
Local package version is up-to-date: mongo-decimal@0.1.4
Local package version is up-to-date: mongo-dev-server@1.1.1
Local package version is up-to-date: mongo-id@1.0.9
Local package version is up-to-date: npm-mongo@4.17.4
Local package version is up-to-date: ordered-dict@1.2.0
Local package version is up-to-date: promise@1.0.0
Local package version is up-to-date: raix:eventemitter@1.0.0
Local package version is up-to-date: random@1.2.2
Local package version is up-to-date: rate-limit@1.1.2
Local package version is up-to-date: react-fast-refresh@0.2.9
Local package version is up-to-date: react-meteor-data@3.0.2
Local package version is up-to-date: reactive-var@1.0.13
Local package version is up-to-date: reload@1.3.2
Local package version is up-to-date: retry@1.1.1
Local package version is up-to-date: routepolicy@1.1.2
Local package version is up-to-date: server-render@0.4.2
Local package version is up-to-date: sha@1.0.10
Local package version is up-to-date: shell-server@0.6.0
Local package version is up-to-date: socket-stream-client@0.5.3
Local package version is up-to-date: spacebars-compiler@2.0.0
Local package version is up-to-date: standard-minifier-css@1.9.3
Local package version is up-to-date: standard-minifier-js@3.0.0
Local package version is up-to-date: static-html@1.3.3
Local package version is up-to-date: templating-tools@2.0.0
Local package version is up-to-date: tmeasday:check-npm-versions@0.3.2
Local package version is up-to-date: tracker@1.3.4
Local package version is up-to-date: typescript@5.4.3
Local package version is up-to-date: underscore@1.6.4
Local package version is up-to-date: url@1.3.3
Local package version is up-to-date: webapp@2.0.2
Local package version is up-to-date: webapp-hashing@1.1.2
Local package version is up-to-date: zodern:types@1.0.13
Doing HTTP request:  POST
https://www.meteor.com/oauth2/authorize?state=151a2***&response_type=code&client_id=LdpZEt7ubqXAfkDJ2&redirect_uri=https%3A%2F%2Factivity.meteor.com%2F_oauth%2Fmeteor-developer%3Fclose
Doing HTTP request:  GET
https://activity.meteor.com/_oauth/meteor-developer?close=&state=151a2***&code=Q8pqpR2fs6Jf3hDyB&only_credential_secret_for_test=1

I’m not sure if --no-release-check works.
And if we could disable some HTTP requests, it would improve few seconds.

I simply add this to my /etc/hosts file, now it took only 3 seconds (vs 7 seconds before) to display changes.

# test meteor build
127.0.0.1       www.meteor.com  activity.meteor.com

Do you use the app mentioned in the author’s message for this issue, or one of your own?

Based on your tests, does this seem like a network issue? Does it happen with all your projects or just with this one using “Meteor 3.0.3 + React 18 + MUI 5”?

Since this post suggests it’s related to MUI, I thought it was more of a build issue than a network problem. Anyway, my suggestion above is worth to try.

The part I mentioned above is just about meteor-tool package. Not the network issue.
If I add

recordPackageUsage: false,

after this line: meteor/tools/cli/commands.js at devel · meteor/meteor · GitHub
It will look like this:

        cordovaRunner: cordovaRunner,
        recordPackageUsage: false,
        onBuilt: function () {

It will skip those http requests.

Hi, already changed the imports to those recommended by mui, couldn’t observe any changes though.

If you grep scan your project, can you find any usages of import * ?
Just a small check in case it’s mass importing all of MUI.

I can confirm this had the same effect on my project. 4-5 seconds now instead of 7-8 before the change.

Same here. I made sure everything is imported default and not name-imported. This is a continuous check from the start of the projects in order to ensure bundles remain as small as possible.

1 Like

Don‘t import like that, and i guess this can‘t be the cause of this, as in 2.16 the issue doesn‘t exist with the same codebase.

Yes, that’s exactly the point where the extra wait time comes from, I also observed that. #6 and #7 themselves are as quick as on 2.16

Same issue here. I hope the team is trying fix this. Development takes so much time now…

Could you please detail your stack?! Meteor 3, React 18?! MUI?

Meteor 3.0.3, react 17, mui 5

We have started slow process to unmeteorize our project, this will take at least a year with our small team

Do you know what those http requests are for? Telemetry?

Just for reporting packages usages. They should be behind the scene (fire and forget)

1 Like

That might be too much telemetry on rebuild or at the very least, should not be blocking.