Skip to content
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

refactor[react-devtools]: flatten reload and profile config #31132

Merged

Conversation

hoxyq
Copy link
Contributor

@hoxyq hoxyq commented Oct 7, 2024

Stacked on #31131. See last commit.

This is a clean-up and a pre-requisite for next changes:

  1. ReloadAndProfileConfig is now split into boolean value and settings object. This is mainly because I will add one more setting soon, and also because settings might be persisted for a longer time than the flag which signals if the Backend was reloaded for profiling. Ideally, this settings should probably be moved to the global Hook object, same as we did for console patching.
  2. Host is now responsible for reseting the cached values, Backend will execute provided onReloadAndProfileFlagsReset callback.

@hoxyq hoxyq requested a review from EdmondChuiHW October 7, 2024 10:16
Copy link

vercel bot commented Oct 7, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
react-compiler-playground ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 9, 2024 0:54am

@@ -16,7 +16,6 @@ export function createStore(bridge: FrontendBridge, config?: Config): Store {
return new Store(bridge, {
checkBridgeProtocolCompatibility: true,
supportsTraceUpdates: true,
supportsTimeline: true,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this intended?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, it was intended, but let me revert this to how it was previously implemented.

packages/react-devtools-core/src/backend.js Outdated Show resolved Hide resolved
Comment on lines +147 to +155
// Agent read flags successfully, we can count it as successful launch
// Clean up flags, so that next reload won't start profiling
onReloadAndProfileFlagsReset();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this a safe assumption? Would it be possible that rendering/profiling start async/later somehow?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, because these are reload and profile flags. If Backend was reloaded for profiling, then we should've already read them, when Hook is initialized, or when Agent is constructed.

This doesn't affect basic profiling without reloading.

@hoxyq hoxyq force-pushed the react-devtools/flatten-reload-and-profile branch 2 times, most recently from d56ef66 to 2467fcc Compare October 9, 2024 12:39
@hoxyq hoxyq force-pushed the react-devtools/flatten-reload-and-profile branch from 2467fcc to 31b9b70 Compare October 9, 2024 12:49
@hoxyq hoxyq force-pushed the react-devtools/flatten-reload-and-profile branch from 31b9b70 to 798af8b Compare October 9, 2024 12:49
@hoxyq hoxyq merged commit bfe91fb into facebook:main Oct 9, 2024
184 checks passed
@hoxyq hoxyq deleted the react-devtools/flatten-reload-and-profile branch October 9, 2024 12:57
hoxyq added a commit that referenced this pull request Oct 9, 2024
Stacked on #31132. See last
commit.

There are 2 issues:
1. We've been recording timeline events, even if Timeline Profiler was
not supported by the Host. We've been doing this for React Native, for
example, which would significantly regress perf of recording a profiling
session, but we were not even using this data.
2. Currently, we are generating component stack for every state update
event. This is extremely expensive, and we should not be doing this.

We can't currently fix the second one, because we would still need to
generate all these stacks, and this would still take quite a lot of
time. As of right now, we can't generate a component stack lazily
without relying on the fact that reference to the Fiber is not stale.
With `enableOwnerStacks` we could populate component stacks in some
collection, which would be cached at the Backend, and then returned only
once Frontend asks for it. This approach also eliminates the need for
keeping a reference to a Fiber.
hoxyq added a commit that referenced this pull request Oct 15, 2024
Changes in this release:

* Fix React Compiler badging ([poteto](https://github.com/poteto) in
[#31196](#31196))
* fix[react-devtools]: fixed timeline profiler tests
([hoxyq](https://github.com/hoxyq) in
[#31261](#31261))
* fix[react-devtools]: record timeline data only when supported
([hoxyq](https://github.com/hoxyq) in
[#31154](#31154))
* refactor[react-devtools]: flatten reload and profile config
([hoxyq](https://github.com/hoxyq) in
[#31132](#31132))
* fix[react-devtools]: remove all listeners when Agent is shutdown
([hoxyq](https://github.com/hoxyq) in
[#31151](#31151))
* fix[react-devtools]: removed redundant startProfiling call
([hoxyq](https://github.com/hoxyq) in
[#31131](#31131))
* refactor[react-devtools/fiber/renderer]: optimize durations resolution
([hoxyq](https://github.com/hoxyq) in
[#31118](#31118))
* fix[react-devtools]: update profiling status before receiving response
from backend ([hoxyq](https://github.com/hoxyq) in
[#31117](#31117))
* fix[react-devtools]: wrap key string in preformatted text html element
([hoxyq](https://github.com/hoxyq) in
[#31153](#31153))
* chore[react-devtools]: drop legacy context tests
([hoxyq](https://github.com/hoxyq) in
[#31059](#31059))
* chore[react-devtools]: add legacy mode error message to the ignore
list for tests ([hoxyq](https://github.com/hoxyq) in
[#31060](#31060))
* fix[react-devtools]: request hook initialization inside http server
response ([hoxyq](https://github.com/hoxyq) in
[#31102](#31102))
* [Flight] Serialize Server Components Props in DEV
([sebmarkbage](https://github.com/sebmarkbage) in
[#31105](#31105))
* Add: reload to profile for Fusebox
([EdmondChuiHW](https://github.com/EdmondChuiHW) in
[#31021](#31021))
* refactor: allow custom impl of backend realod-to-profile support check
([EdmondChuiHW](https://github.com/EdmondChuiHW) in
[#31048](#31048))
* fix: use public instance in Fiber renderer and expose it from
getInspectorDataForViewAtPoint ([hoxyq](https://github.com/hoxyq) in
[#31068](#31068))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed React Core Team Opened by a member of the React Core Team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants