Skip to content

Conversation

@huntie
Copy link
Member

@huntie huntie commented Nov 3, 2025

Summary

Adds the experimental frontend UI for Performance Issues (facebook/react-native#54265), a new performance signals concept for React Native.

See also facebook/react#34961.

Overview

  • Introduces SidebarRNPerfIssuesTab, which will be shown in the Performance sidebar if any rnPerfIssue events are present in the selected performance trace.
  • This renders a list of issues which group individual event locations.
  • Clicking individual events will select and visually focus where the event occurs in the timeline.

Test plan

Setup:

  • Enable experiment in RN.
  • Add devtools.performanceIssue object in ReactFabric-dev.js (planned change in React core).
  • Record a performance trace.

[FB only] 🎬 https://pxl.cl/8qk0t

✅ "Performance Issues" tab is rendered
✅ Perf panel sidebar is open by default
✅ Event selection
✅ Event selection via keyboard
✅ Event deselection (click anywhere in timeline)

Upstreaming plan

@huntie huntie requested review from hoxyq and sbuggay November 3, 2025 15:13
@meta-cla meta-cla bot added the cla signed label Nov 3, 2025
/**
* [RN] Apply highlighting/dimming to a specific Performance Issue event.
*/
updatePerfIssueFlameChartDimmer(event: Trace.Types.Events.Event): void {
Copy link
Member Author

Choose a reason for hiding this comment

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

Note: These changes in the implementation of TimelineFlameChartView are necessary — since there aren't existing APIs for quite the same event selection + highlighting, with the Find panel working slightly differently.

@huntie huntie force-pushed the feature-perf-issues-sub-panel branch 5 times, most recently from 6e47e4b to 69cb456 Compare November 6, 2025 14:10
Copy link

@hoxyq hoxyq left a comment

Choose a reason for hiding this comment

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

The build script is failing, probably forgot to add some files to target's BUILD.gn

@huntie huntie force-pushed the feature-perf-issues-sub-panel branch from 69cb456 to e6e89d1 Compare November 6, 2025 17:34
@huntie
Copy link
Member Author

huntie commented Nov 6, 2025

@hoxyq Feedback actioned ✅

@huntie huntie merged commit d37d426 into facebook:main Nov 6, 2025
5 checks passed
@huntie huntie deleted the feature-perf-issues-sub-panel branch November 6, 2025 18:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants