Add patch to fix accumulated negative deltas (#305)
## Context Hi! I'm working on an experimental React [concurrent mode profiler](https://react-scheduling-profiler.vercel.app) in partnership with the React core team, and we're using a [custom build of Speedscope](https://github.com/taneliang/speedscope/compare/master...taneliang:fork-for-scheduling-profiler) that exposes Speedscope's internals to support our custom flamechart rendering. Specifically, Speedscope is used to import and process Chrome profiles, which are then fed to our rendering code that draws everything to a canvas. Here's a screenshot of our app for context. The stuff above the thick gray bar is React data (some React Fiber lanes, React events, and other user timing marks), and a flamechart is drawn below.  ## Problem Early on, we had [an issue](https://github.com/MLH-Fellowship/scheduling-profiler-prototype/issues/42) where our flamechart was not aligned with the React data. The discrepancy between the flamechart frames and our React data grew over the time of the profile. We tracked down the cause to https://github.com/jlfwong/speedscope/pull/80, which resolves https://github.com/jlfwong/speedscope/issues/70. It seems like zeroing out those negative time deltas resulted in the accumulation of errors over the time of these profiles, which resulted in the very visible misalignment in our profiler. I am confident that the React data's timestamps are correct because they are obtained from User Timing marks, which have absolute timestamps and are thus independent of any `timeDelta` stuff. This would mean that Speedscope is likely displaying incorrect timestamps for Chrome profiles. ## Solution This PR takes a different approach to solving the negative `timeDelta` problem: we add a `lastElapsed` variable as a sort of backstop, preventing `elapsed` from traveling backwards in time, while still ensuring that `elapsed` is always accurate. We've been using this patch in our custom build for about a month now and it seems to work well.
This commit is contained in:
@@ -633,7 +633,7 @@ Object {
|
||||
"line": 0,
|
||||
"name": "(anonymous)",
|
||||
"selfWeight": 0,
|
||||
"totalWeight": 2591,
|
||||
"totalWeight": 2524,
|
||||
},
|
||||
Frame {
|
||||
"col": -1,
|
||||
@@ -641,8 +641,8 @@ Object {
|
||||
"key": "Worker::-1:-1",
|
||||
"line": -1,
|
||||
"name": "Worker",
|
||||
"selfWeight": 873,
|
||||
"totalWeight": 2591,
|
||||
"selfWeight": 806,
|
||||
"totalWeight": 2524,
|
||||
},
|
||||
Frame {
|
||||
"col": 29,
|
||||
@@ -731,7 +731,7 @@ Object {
|
||||
"(program) 11.20ms",
|
||||
" 296.00µs",
|
||||
"(program) 1.90ms",
|
||||
"(anonymous);Worker 873.00µs",
|
||||
"(anonymous);Worker 806.00µs",
|
||||
"(anonymous);Worker;(program) 1.72ms",
|
||||
" 670.00µs",
|
||||
"(program) 28.45ms",
|
||||
@@ -1305,7 +1305,7 @@ Object {
|
||||
"line": 0,
|
||||
"name": "(anonymous)",
|
||||
"selfWeight": 542,
|
||||
"totalWeight": 6218,
|
||||
"totalWeight": 6115,
|
||||
},
|
||||
Frame {
|
||||
"col": 25,
|
||||
@@ -1314,7 +1314,7 @@ Object {
|
||||
"line": 30,
|
||||
"name": "insertTextScript",
|
||||
"selfWeight": 392,
|
||||
"totalWeight": 977,
|
||||
"totalWeight": 874,
|
||||
},
|
||||
Frame {
|
||||
"col": 25,
|
||||
@@ -1322,8 +1322,8 @@ Object {
|
||||
"key": "insertHeaderNode:chrome-extension://denbgaamihkadbghdceggmchnflmhpmk/contentScript.js:57:25",
|
||||
"line": 57,
|
||||
"name": "insertHeaderNode",
|
||||
"selfWeight": 292,
|
||||
"totalWeight": 585,
|
||||
"selfWeight": 189,
|
||||
"totalWeight": 482,
|
||||
},
|
||||
Frame {
|
||||
"col": undefined,
|
||||
@@ -1558,7 +1558,7 @@ Object {
|
||||
"(anonymous);(anonymous);(anonymous);(program) 27.49ms",
|
||||
"(anonymous) 542.00µs",
|
||||
"(anonymous);insertTextScript 392.00µs",
|
||||
"(anonymous);insertTextScript;insertHeaderNode 292.00µs",
|
||||
"(anonymous);insertTextScript;insertHeaderNode 189.00µs",
|
||||
"(anonymous);insertTextScript;insertHeaderNode;appendChild;(anonymous);(anonymous) 148.00µs",
|
||||
"(anonymous);insertTextScript;insertHeaderNode;appendChild 145.00µs",
|
||||
"(anonymous);listenForMessage;get webstore 148.00µs",
|
||||
|
||||
+20
-8
@@ -224,6 +224,9 @@ export function importFromChromeCPUProfile(chromeProfile: CPUProfile): Profile {
|
||||
// Ref: https://github.com/v8/v8/blob/44bd8fd7/src/inspector/js_protocol.json#L1485
|
||||
let elapsed = chromeProfile.timeDeltas[0]
|
||||
|
||||
// Prevents negative time deltas from causing bad data.
|
||||
let lastElapsed = elapsed
|
||||
|
||||
let lastNodeId = NaN
|
||||
|
||||
// The chrome CPU profile format doesn't collapse identical samples. We'll do that
|
||||
@@ -232,21 +235,30 @@ export function importFromChromeCPUProfile(chromeProfile: CPUProfile): Profile {
|
||||
const nodeId = chromeProfile.samples[i]
|
||||
if (nodeId != lastNodeId) {
|
||||
samples.push(nodeId)
|
||||
sampleTimes.push(elapsed)
|
||||
if (elapsed < lastElapsed) {
|
||||
sampleTimes.push(lastElapsed)
|
||||
} else {
|
||||
sampleTimes.push(elapsed)
|
||||
lastElapsed = elapsed
|
||||
}
|
||||
}
|
||||
|
||||
if (i === chromeProfile.samples.length - 1) {
|
||||
if (!isNaN(lastNodeId)) {
|
||||
samples.push(lastNodeId)
|
||||
sampleTimes.push(elapsed)
|
||||
if (elapsed < lastElapsed) {
|
||||
sampleTimes.push(lastElapsed)
|
||||
} else {
|
||||
sampleTimes.push(elapsed)
|
||||
lastElapsed = elapsed
|
||||
}
|
||||
}
|
||||
} else {
|
||||
let timeDelta = chromeProfile.timeDeltas[i + 1]
|
||||
if (timeDelta < 0) {
|
||||
// This is super noisy, but can be helpful when debugging strange data
|
||||
// console.warn('Substituting zero for unexpected time delta:', timeDelta, 'at index', i)
|
||||
timeDelta = 0
|
||||
}
|
||||
const timeDelta = chromeProfile.timeDeltas[i + 1]
|
||||
// This is super noisy, but can be helpful when debugging strange data
|
||||
// if (timeDelta < 0) {
|
||||
// console.warn('Substituting zero for unexpected time delta:', timeDelta, 'at index', i)
|
||||
// }
|
||||
|
||||
elapsed += timeDelta
|
||||
lastNodeId = nodeId
|
||||
|
||||
Reference in New Issue
Block a user