Readability in Waterfall View

Feature Suggestions
1

I am often having a hard time locating the lines “Start Render”, “msFirstPaint” and “DOM Interactive” in the Waterfall View. Maybe because I am a bit color blind. I guess the readability could be improved, maybe by doing one of these:

  1. Use both color and line style – eg. make Start Render dashed, make msFirstPaint dotted and keep DOM Interactive solid.

  2. Include the legend in the image and connect the legend and actual lines by drawing a thin line between them.

In some Waterfall Views I cannot find one of Start Render and msFirstPaint. Are these lines sometimes rendered on top of each other? Maybe the dash pattern could match so both lines are still visible?

Thanks for a great service!

2

As far as overlapping lines, yes - it’s possible for start render and msFirstPaint to be on top of each other (that would actually be good and means they both reported the same time).

Sorry about the difficulty with the colors. Next time I’m in the waterfall code I’ll see how difficult it is to use patterns as well. I opened a github issue to track it so I don’t forget and in case someone else can tackle it: Improve waterfall readability · Issue #621 · WPO-Foundation/webpagetest · GitHub