如何解释 chrome 火焰图中的差距

Question

我正在尝试更好地理解如何解释 chrome 火焰图。
在下图中，_changeHandler 显示为四个不同的块。 但是我知道它只被调用一次。

我在这里看到一个类似的问题，它声称这可能是一个错误，但那是四年前的事了：
What are this gap mean in Chrome devtools profile flame chart

问题：
在哪种情况下，chrome perf 工具会在同一函数调用的火焰图中显示间隙？

真正的问题是它确实使整个图无效。图形片段的底部但顶部是相同的功能。我根本不知道如何理解这一点。

使用 cpu 节流时，问题会呈指数级恶化。 看第二张图，它与第一张图的操作相同，但是 cpu 节流设置为 5 倍减速。
"Function Call" 下的零散栏是单个函数调用，由于某种原因，它被分成数百个部分。

Answer 1

Thing is, we get the JS function data by sampling (unlike native events that we get by instrumenting start/stop). So internally it's just 4 samples that landed into the said function. We don't know if it was executed once or 4 times or 100 times, but we do our best to glue them so as it appeared as one call as long as the samples are adjacent.

But sometimes this logic mysteriously fails. Most of the time, this is because of some problems while sampling the JS stack (if some inlined or native function is on top, we sometimes fail to unwind the stack properly).

来源：与 DevTools 工程师聊天

如果你想privately submit a url / steps to reproduce，团队可以检查一下。他们认为他们修复了这类错误。