[DevTools Bug]: React DevTools Profiler freezes after recording multiple events

[MariniGraphicDesigner]

Website or app

localhost

Repro steps

I'm experiencing an issue with React DevTools while debugging a project locally. Here are the steps to reproduce the issue:

1. Open React DevTools and navigate to the Profiler tab.
2. Start a recording by clicking on "Start Profiling," then stop it by clicking on "Stop Profiling."
3. View the recording results without any issues.
4. Attempt to start a new recording by clicking on "Start Profiling" again.
5. After a few moments, the Profiler becomes extremely slow or completely unresponsive.
6. At this point, I am unable to make additional recordings or refresh the Profiler data.

I hope these details help in identifying and resolving the issue. Let me know if you need further information or clarification.

How often does this bug happen?

Every time

DevTools package (automated)

No response

DevTools version (automated)

No response

Error message (automated)

No response

Error call stack (automated)

No response

Error component stack (automated)

No response

GitHub query string (automated)

No response

[adi-ydv-1]

@MariniGraphicDesigner try to clear your local cache.

[kevcam4891]

I'm encountering this issue as well. Recording even for a few seconds in profiler, then stopping, paints the flame graph successfully, but then all future clicks to the UI do not do anything. Closing dev tools then reopening, the react dev tools are no longer available in the tab bar.

[GaneshS288]

I started using react just today and encountered this while going over the devtools. I am attaching a video of the behaviour. It seems to freeze whenever i have previous profiling data present and I try to press start profiling.

20250112-1028-59.9864090.mp4

If you clear the profiling data before pressing start profiling button or press the reload and start profiling it works

[MariniGraphicDesigner]

Sto riscontrando anche questo problema. La registrazione anche per alcuni secondi nel profiler, quindi l'arresto, dipinge correttamente il grafico della fiamma, ma tutti i clic futuri sull'interfaccia utente non fanno nulla. Chiudendo gli strumenti di sviluppo e poi riaprendo, gli strumenti di sviluppo delle reazioni non sono più disponibili nella barra delle schede.

I also have the exact same problem. After the Profiler tab freezes, even closing and reopening causes the React DevTools to disappear. I can also confirm that the video by @GaneshS288 shows the same behavior that happens to me and that I tried to describe in my post.

[V3RON]

I believe I have pinpointed the exact reason why this is happening.

Profiling works fine the first time, but subsequently, the Dev Tools enter an infinite loop of state updates. It begins with a call to the startProfiling function. Next, SnapshotSelector invokes selectCommitIndex(0) because profiling data from a previous session is available, which triggers another re-render. Then, ProfilerContextProvider calls selectCommitIndex(null) because no commit is selected, causing yet another re-render. This loop continues indefinitely.

However, when you pause execution using a debugger in the startProfiling function and first call clear to remove the existing profiling data, everything functions correctly.