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
In #289 we added a V1 of diff rendering. The functionality was very complicated so we focused this first version on just getting something usable. However, for those not familiar with flamegraphs I don't think this view is very "intuitive".
This issue has a couple of suggestions that might help with this, along with a few styling tweaks/cleanup.
In the comparison view page, we add each element to a panel so that it stands out from the background. The flamegraphs also fall neatly beneath the timeline components See panels highlighted in green:
For the diff view page we don't have these panels -- see red:
There are a couple of issues here:
Because there are two timeline components (left and right) and two components correspondingly beneath them (table and flamegraph, respectively) it becomes confusing.
On the comparison view (picture with two green squares), left timeline corresponds to left flamegraph beneath it and right timeline corresponds to right flamegraph beneath it.
On the diff view (picture with red square), the left timeline actually corresponds to the base flamegraph and the right timeline corresponds to the comparison flamegraph that you are using for the diff. Both the table and the flamegraph component below are a combination (or diff depending on how you look at it) between the flamegraph that results from the left timeline and the flamegraph that results for the right timeline.
As it stands currently it looks as though the left table corresponds with the left timeline and the right flamegraph corresponds with the right timeline.
In order to fix this, what we should do is make both the flamegraph and the table take up 100% of the width to convey that they they are related to both timelines as opposed to the timeline on either specific side. Doing this, the flamegraph should be on top and the table should be beneath it like this:
We should also consider going a step further and explicitly dividing / labeling the important components on the page. something like this (note I didn't include legend in this image because its just a mock but legend should remain):
Sidenote: Changed color of bars in table to be grey instead of Orange.
The text was updated successfully, but these errors were encountered:
* Remove `-help-all` as this is not a thing in Phlare (yet)
* Adding goreleaser to create artifacts
* Fixes the docker build CI
* Fixes the docker build CI
* Fixes the docker build CI
* Fixes the docker build CI
* Add the current go version for the CI
* Adds some documentation about the release
* Integrates review feedback
Co-authored-by: Christian Simon <simon@swine.de>
In #289 we added a V1 of diff rendering. The functionality was very complicated so we focused this first version on just getting something usable. However, for those not familiar with flamegraphs I don't think this view is very "intuitive".
This issue has a couple of suggestions that might help with this, along with a few styling tweaks/cleanup.
In the comparison view page, we add each element to a panel so that it stands out from the background. The flamegraphs also fall neatly beneath the timeline components See panels highlighted in green:
For the diff view page we don't have these panels -- see red:
There are a couple of issues here:
Because there are two timeline components (left and right) and two components correspondingly beneath them (table and flamegraph, respectively) it becomes confusing.
On the comparison view (picture with two green squares), left timeline corresponds to left flamegraph beneath it and right timeline corresponds to right flamegraph beneath it.
On the diff view (picture with red square), the left timeline actually corresponds to the base flamegraph and the right timeline corresponds to the comparison flamegraph that you are using for the diff. Both the table and the flamegraph component below are a combination (or diff depending on how you look at it) between the flamegraph that results from the left timeline and the flamegraph that results for the right timeline.
As it stands currently it looks as though the left table corresponds with the left timeline and the right flamegraph corresponds with the right timeline.
In order to fix this, what we should do is make both the flamegraph and the table take up 100% of the width to convey that they they are related to both timelines as opposed to the timeline on either specific side. Doing this, the flamegraph should be on top and the table should be beneath it like this:
We should also consider going a step further and explicitly dividing / labeling the important components on the page. something like this (note I didn't include legend in this image because its just a mock but legend should remain):
Sidenote: Changed color of bars in table to be grey instead of Orange.
The text was updated successfully, but these errors were encountered: