dillon1000/react

Commit

[Fiber] Log the Render/Commit phases and the gaps in between (#31016)

A slight behavior change here too is that I now mark the start of the
commit phase before the BeforeMutationEffect phase. This affects
`<Profiler>` too.

The named sequences are as follows:

Render -> Suspended or Throttled -> Commit -> Waiting for Paint ->
Remaining Effects

The Suspended phase is only logged if we delay the Commit due to CSS /
images.

The Throttled phase is only logged if we delay the commit due to the
Suspense throttling timer.

<img width="1246" alt="Screenshot 2024-09-20 at 9 14 23 PM"
src="https://github.com/user-attachments/assets/8d01f444-bb85-472b-9b42-6157d92c81b4">

I don't yet log render phases that don't complete. I think I also need
to special case renders that or don't commit after being suspended.
Browse files
Changed paths6 files
First-parent comparison
M packages/react-reconciler/src/ReactFiberCommitEffects.js ModifiedM packages/react-reconciler/src/ReactFiberCommitWork.js ModifiedM packages/react-reconciler/src/ReactFiberPerformanceTrack.js ModifiedM packages/react-reconciler/src/ReactFiberWorkLoop.js ModifiedM packages/react-reconciler/src/ReactProfilerTimer.js ModifiedM packages/react/src/__tests__/ReactProfiler-test.internal.js Modified
Patch

Files changed

Rendering syntax-highlighted changes…