Merged threads look messy on stack chart if the threads are overlapping with each other

[canova]

So thread merging simply merges the threads by merging the samples depending on their timestamps.

For example, let's say that we have two threads like this with the samples in the graph:

[----------]
                [--------]
                            [--------]

This will be merged properly like this:

[----------]    [--------]  [--------]

So this case is fine, because they don't overlap with each other.

---

But if the threads are overlapping with each other like this:

[--------------]
          [------------]

In this case, when we merge these threads, since the threads overlap with each other in the timeline, we will just sort the samples by their timestamp and put them in the same thread. This will create a thread like this:

[---------[++++]-------]

The samples marked with - are okay in this case like before. But in the area that is marked with +, since we are merging samples from different threads, it will merge the samples like this: Sample[ThreadA] -> Sample[ThreadB] -> Sample[ThreadA] -> Sample[ThreadB] -> Sample[ThreadA].

Since we put the samples in an order like this, stack chart will look pretty bad (with very small functions calls all the time), because it's not not possible to merge the different call trees with each other.

We are doing the naive thing currently by merging these thread by their timetamps. It would be better to find a way to handle this case more gracefully.

┆Issue is synchronized with this Jira Task

[julienw]

We'll disable stack chart in https://github.com/firefox-devtools/profiler/issues/3871 in this situation for now.