fix: Prevent lengthy spinner on load when selected network is slow#35516
Merged
fix: Prevent lengthy spinner on load when selected network is slow#35516
Conversation
Contributor
|
CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes. |
mcmire
force-pushed
the
dont-await-net-version-request
branch
from
fd69790 to
d9b8ac3
Compare
mcmire
changed the title
Contributor
Author
|
Blocked by MetaMask/providers#422. |
mcmire
changed the title
mcmire
force-pushed
the
dont-await-net-version-request
branch
from
d9b8ac3 to
23ecdbf
Compare
Collaborator
📊 Page Load Benchmark ResultsCurrent Commit: 📄 https://metamask.github.io/test-dapp/Samples: 100 Summary
📈 Detailed Results
Results generated automatically by MetaMask CI |
Collaborator
Builds ready [23ecdbf]
UI Startup Metrics (1227 ± 75 ms)
Benchmark value 24 exceeds gate value 23 for chrome browserify home mean firstReactRender Benchmark value 6 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 1394 exceeds gate value 1365 for chrome browserify home p95 uiStartup Benchmark value 1245 exceeds gate value 1190 for chrome browserify home p95 load Benchmark value 1236 exceeds gate value 1180 for chrome browserify home p95 domContentLoaded Benchmark value 271 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 21 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 997 exceeds gate value 940 for chrome browserify home p95 loadScripts Benchmark value 20 exceeds gate value 17 for chrome browserify home p95 setupStore Benchmark value 34 exceeds gate value 29 for chrome webpack home mean getState Benchmark value 8 exceeds gate value 7 for chrome webpack home mean initialActions Benchmark value 2455 exceeds gate value 2454 for chrome webpack home p95 uiStartup Benchmark value 277 exceeds gate value 195 for chrome webpack home p95 getState Benchmark value 14 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 1412 exceeds gate value 1405 for firefox browserify home mean uiStartup Benchmark value 34 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 28 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 4 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 13 exceeds gate value 9 for firefox browserify home mean setupStore Benchmark value 1678 exceeds gate value 1660 for firefox browserify home p95 uiStartup Benchmark value 256 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 86 exceeds gate value 70 for firefox browserify home p95 backgroundConnect Benchmark value 9 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 54 exceeds gate value 27 for firefox browserify home p95 setupStore Benchmark value 1636 exceeds gate value 1615 for firefox webpack home mean uiStartup Benchmark value 1402 exceeds gate value 1380 for firefox webpack home mean load Benchmark value 1402 exceeds gate value 1380 for firefox webpack home mean domContentLoaded Benchmark value 107 exceeds gate value 100 for firefox webpack home mean domInteractive Benchmark value 32 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 45 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 6 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 1379 exceeds gate value 1360 for firefox webpack home mean loadScripts Benchmark value 272 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 54 exceeds gate value 50 for firefox webpack home p95 firstReactRender Benchmark value 10 exceeds gate value 2 for firefox webpack home p95 initialActions Sum of mean exceeds: 389ms | Sum of p95 exceeds: 819.8ms Sum of all benchmark exceeds: 1208.8ms Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
Collaborator
📊 Page Load Benchmark ResultsCurrent Commit: 📄 https://metamask.github.io/test-dapp/Samples: 100 Summary
📈 Detailed Results
Results generated automatically by MetaMask CI |
Collaborator
Builds ready [eaec544]
UI Startup Metrics (1246 ± 70 ms)
Benchmark value 1080 exceeds gate value 1070 for chrome browserify home mean load Benchmark value 1072 exceeds gate value 1061 for chrome browserify home mean domContentLoaded Benchmark value 254 exceeds gate value 10 for chrome browserify home mean backgroundConnect Benchmark value 24 exceeds gate value 23 for chrome browserify home mean firstReactRender Benchmark value 6 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 1401 exceeds gate value 1365 for chrome browserify home p95 uiStartup Benchmark value 1248 exceeds gate value 1190 for chrome browserify home p95 load Benchmark value 1235 exceeds gate value 1180 for chrome browserify home p95 domContentLoaded Benchmark value 268 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 11 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 999 exceeds gate value 940 for chrome browserify home p95 loadScripts Benchmark value 236 exceeds gate value 195 for chrome webpack home p95 getState Benchmark value 21 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 34 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 27 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 6 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 11 exceeds gate value 9 for firefox browserify home mean setupStore Benchmark value 240 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 11 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 105 exceeds gate value 100 for firefox webpack home mean domInteractive Benchmark value 31 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 43 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 4 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 273 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 6 exceeds gate value 2 for firefox webpack home p95 initialActions Sum of mean exceeds: 320ms | Sum of p95 exceeds: 697.8ms Sum of all benchmark exceeds: 1017.8ms Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
When starting, the UI creates a StreamProvider that wraps the MetaMask provider and can be used to make internal and external requests through the core JSON-RPC pipeline via the background connection. This StreamProvider must be initialized in order for the UI to complete the start sequence and in order for users to see anything on screen. When the StreamProvider initializes, it will make a background request for `metamask_getProviderState` to populate its internal state. As a part of its logic, this RPC method will retrieve the network version from whichever RPC endpoint is currently selected. However, this creates a problem, because if the network is slow, this request won't resolve in a timely manner, causing the UI will be stuck in a loading state and for users to see a spinner in the meantime. To address this, this commit changes the `metamask_getProviderState` handler to accept a parameter, `isInitializingStreamProvider`. It expects that StreamProvider will call the RPC method and pass `true` for this parameter. When this happens, the request for `net_version` will not be made and the initial network version will be set to "loading". This allows the UI to complete its start sequence. Once the UI is loaded, it will update the `memStore` state, and `metamask_getProviderState` will be requested again, but this time, `isInitializingStreamProvider` will be set to `false`. This means the network version will be properly retrieved and propagated to all of the places that need it.
mcmire
force-pushed
the
dont-await-net-version-request
branch
from
24750d2 to
663fe9a
Compare
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
Collaborator
📊 Page Load Benchmark ResultsCurrent Commit: 📄 https://metamask.github.io/test-dapp/Samples: 100 Summary
📈 Detailed Results
Results generated automatically by MetaMask CI |
Collaborator
Builds ready [663fe9a]
UI Startup Metrics (1216 ± 72 ms)
Benchmark value 24 exceeds gate value 23 for chrome browserify home mean firstReactRender Benchmark value 5 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 1183 exceeds gate value 1180 for chrome browserify home p95 domContentLoaded Benchmark value 265 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 15 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 8 exceeds gate value 7 for chrome webpack home mean initialActions Benchmark value 70 exceeds gate value 57 for chrome webpack home p95 domInteractive Benchmark value 269 exceeds gate value 195 for chrome webpack home p95 getState Benchmark value 13 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 1417 exceeds gate value 1405 for firefox browserify home mean uiStartup Benchmark value 35 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 27 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 3 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 11 exceeds gate value 9 for firefox browserify home mean setupStore Benchmark value 233 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 91 exceeds gate value 70 for firefox browserify home p95 backgroundConnect Benchmark value 9 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 34 exceeds gate value 27 for firefox browserify home p95 setupStore Benchmark value 105 exceeds gate value 100 for firefox webpack home mean domInteractive Benchmark value 32 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 43 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 5 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 266 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 51 exceeds gate value 50 for firefox webpack home p95 firstReactRender Benchmark value 7 exceeds gate value 2 for firefox webpack home p95 initialActions Sum of mean exceeds: 294ms | Sum of p95 exceeds: 545.8ms Sum of all benchmark exceeds: 839.8ms Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
Collaborator
📊 Page Load Benchmark ResultsCurrent Commit: 📄 https://metamask.github.io/test-dapp/Samples: 100 Summary
📈 Detailed Results
Results generated automatically by MetaMask CI |
Collaborator
Builds ready [6b27273]
UI Startup Metrics (1207 ± 57 ms)
Benchmark value 24 exceeds gate value 23 for chrome browserify home mean firstReactRender Benchmark value 5 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 261 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 17 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 36 exceeds gate value 29 for chrome webpack home mean getState Benchmark value 9 exceeds gate value 7 for chrome webpack home mean initialActions Benchmark value 349 exceeds gate value 334 for chrome webpack home p95 firstPaint Benchmark value 265 exceeds gate value 195 for chrome webpack home p95 getState Benchmark value 13 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 1483 exceeds gate value 1405 for firefox browserify home mean uiStartup Benchmark value 1289 exceeds gate value 1245 for firefox browserify home mean load Benchmark value 1289 exceeds gate value 1239 for firefox browserify home mean domContentLoaded Benchmark value 118 exceeds gate value 110 for firefox browserify home mean domInteractive Benchmark value 37 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 29 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 4 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 1261 exceeds gate value 1230 for firefox browserify home mean loadScripts Benchmark value 10 exceeds gate value 9 for firefox browserify home mean setupStore Benchmark value 1667 exceeds gate value 1660 for firefox browserify home p95 uiStartup Benchmark value 268 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 98 exceeds gate value 70 for firefox browserify home p95 backgroundConnect Benchmark value 13 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 30 exceeds gate value 27 for firefox browserify home p95 setupStore Benchmark value 103 exceeds gate value 100 for firefox webpack home mean domInteractive Benchmark value 31 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 42 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 3 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 268 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 5 exceeds gate value 2 for firefox webpack home p95 initialActions Sum of mean exceeds: 499ms | Sum of p95 exceeds: 586.8ms Sum of all benchmark exceeds: 1085.8ms Bundle size diffs [🚀 Bundle size reduced!]
|
Collaborator
📊 Page Load Benchmark ResultsCurrent Commit: 📄 https://metamask.github.io/test-dapp/Samples: 100 Summary
📈 Detailed Results
Results generated automatically by MetaMask CI |
Collaborator
Builds ready [aa5d781]
UI Startup Metrics (1226 ± 62 ms)
Benchmark value 24 exceeds gate value 23 for chrome browserify home mean firstReactRender Benchmark value 5 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 271 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 12 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 36 exceeds gate value 29 for chrome webpack home mean getState Benchmark value 2483 exceeds gate value 2454 for chrome webpack home p95 uiStartup Benchmark value 271 exceeds gate value 195 for chrome webpack home p95 getState Benchmark value 13 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 32 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 28 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 5 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 223 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 44 exceeds gate value 24 for firefox browserify home p95 getState Benchmark value 8 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 105 exceeds gate value 100 for firefox webpack home mean domInteractive Benchmark value 34 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 44 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 7 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 1955 exceeds gate value 1935 for firefox webpack home p95 uiStartup Benchmark value 258 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 9 exceeds gate value 2 for firefox webpack home p95 initialActions Sum of mean exceeds: 293ms | Sum of p95 exceeds: 557.8ms Sum of all benchmark exceeds: 850.8ms Bundle size diffs [🚀 Bundle size reduced!]
|
Mrtenz
approved these changes
Sep 10, 2025
metamaskbot
added
the
release-13.4.0
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
4 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
When starting, the UI creates a StreamProvider that wraps the MetaMask provider and can be used to make internal and external requests through the core JSON-RPC pipeline via the background connection. This StreamProvider must be initialized in order for the UI to complete the start sequence and in order for users to see anything on screen.
When the StreamProvider initializes, it will make a background request for
metamask_getProviderStateto populate its internal state. As a part of its logic, this RPC method will retrieve the network version from the dapp-selected RPC endpoint. However, this creates a problem. If the RPC endpoint is slow, this request won't resolve in a timely manner, and the user will continue to see a spinner.To address this, this commit changes the
metamask_getProviderStatehandler to accept a parameter,isInitializingStreamProvider. It expects that StreamProvider will call the RPC method and passtruefor this parameter (this happens in@metamask/provider22.1.1). When this happens, the request fornet_versionwill not be made and the initial network version will be set to "loading". This allows the UI to complete its start sequence regardless of how slow the network is. Once the UI is loaded, it will update thememStorestate, andmetamask_getProviderStatewill be requested again, but this time,isInitializingStreamProviderwill be set tofalse. This means the network version will be properly retrieved and propagated to all of the places that need it.Changelog
CHANGELOG entry: Prevent lengthy spinner on load when selected network is slow to respond
Related issues
Related to #34214
Manual testing steps
mainbranch.getProviderNetworkStateinmetamask-controller.jsand add the following:let networkVersion = this.deprecatedNetworkVersions[networkClientId]; if (networkVersion === undefined && completedOnboarding) { + await new Promise((resolve) => { + setTimeout(() => resolve(), 15000); + }) try { const result = await networkClient.provider.request({ method: 'net_version', }); networkVersion = convertNetworkId(result); } catch (error) { console.error(error); networkVersion = null; } this.deprecatedNetworkVersions[networkClientId] = networkVersion; }yarn start.Screenshots/Recordings
Before
before.mov
After
after.mov
Pre-merge author checklist
Pre-merge reviewer checklist