You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
- things like prepaint, style recalculations, layerization, async web API's like observers may occur during this time
77
77
- how long it took from the last request animation frame to when the dom was committed: ${commitTime.toFixed(0)}ms
78
78
- during this period you will see paint, commit, potential style recalcs, and other misc browser activity. Frequently high times here imply css that makes the browser do a lot of work, or mutating expensive dom properties during the event handler stage. This can be many things, but it narrows the problem scope significantly when this is high
79
-
${framePresentTime&&`- how long it took from dom commit for the frame to be presented: ${framePresentTime.toFixed(0)}ms. This is when information about how to paint the next frame is sent to the compositor threads, and when the GPU does work. If this is high, look for issues that may be a bottleneck for operations occurring during this time`}
79
+
${framePresentTime===null ? '' :`- how long it took from dom commit for the frame to be presented: ${framePresentTime.toFixed(0)}ms. This is when information about how to paint the next frame is sent to the compositor threads, and when the GPU does work. If this is high, look for issues that may be a bottleneck for operations occurring during this time`}
80
80
81
81
### Low level
82
82
We also have lower level information about react components, such as their render time, and which props/state/context changed when they re-rendered.
@@ -140,7 +140,7 @@ We also provide you with a breakdown of what the browser spent time on during th
140
140
- things like prepaint, style recalculations, layerization, async web API's like observers may occur during this time
141
141
- how long it took from the last request animation frame to when the dom was committed: ${commitTime.toFixed(0)}ms
142
142
- during this period you will see paint, commit, potential style recalcs, and other misc browser activity. Frequently high times here imply css that makes the browser do a lot of work, or mutating expensive dom properties during the event handler stage. This can be many things, but it narrows the problem scope significantly when this is high
143
-
${framePresentTime&&`- how long it took from dom commit for the frame to be presented: ${framePresentTime.toFixed(0)}ms. This is when information about how to paint the next frame is sent to the compositor threads, and when the GPU does work. If this is high, look for issues that may be a bottleneck for operations occurring during this time`}
143
+
${framePresentTime===null ? '' :`- how long it took from dom commit for the frame to be presented: ${framePresentTime.toFixed(0)}ms. This is when information about how to paint the next frame is sent to the compositor threads, and when the GPU does work. If this is high, look for issues that may be a bottleneck for operations occurring during this time`}
144
144
145
145
146
146
We also have lower level information about react components, such as their render time, and which props/state/context changed when they re-rendered.
@@ -305,7 +305,7 @@ We also provide you with a breakdown of what the browser spent time on during th
305
305
- things like prepaint, style recalculations, layerization, async web API's like observers may occur during this time
306
306
- how long it took from the last request animation frame to when the dom was committed: ${commitTime.toFixed(0)}ms
307
307
- during this period you will see paint, commit, potential style recalcs, and other misc browser activity. Frequently high times here imply css that makes the browser do a lot of work, or mutating expensive dom properties during the event handler stage. This can be many things, but it narrows the problem scope significantly when this is high
308
-
${framePresentTime&&`- how long it took from dom commit for the frame to be presented: ${framePresentTime.toFixed(0)}ms. This is when information about how to paint the next frame is sent to the compositor threads, and when the GPU does work. If this is high, look for issues that may be a bottleneck for operations occurring during this time`}
308
+
${framePresentTime===null ? '' :`- how long it took from dom commit for the frame to be presented: ${framePresentTime.toFixed(0)}ms. This is when information about how to paint the next frame is sent to the compositor threads, and when the GPU does work. If this is high, look for issues that may be a bottleneck for operations occurring during this time`}
309
309
310
310
We also have lower level information about react components, such as their render time, and which props/state/context changed when they re-rendered.
0 commit comments