firefox-devtools / profiler

Firefox Profiler — Web app for Firefox performance analysis
https://profiler.firefox.com
Mozilla Public License 2.0
1.19k stars 387 forks source link

Misleading NavigationStart lines in this profile #5104

Open mstange opened 1 month ago

mstange commented 1 month ago

Profile: https://share.firefox.dev/3XoGIs0

This profile has 5 Navigation:Start markers. The third marker is the one that indicates the actual navigation start of the page. I'm not sure what the other 4 are for. In the network track, there is no vertical line for that third marker. Why not? The first two Navigation:Start markers definitely have vertical lines. But those lines are not useful because I think they're for subframes. The third Navigation:Start marker is the only one which has a "Page" row in the tooltip.

Would it make sense to only draw these vertical lines if we have the "Page" information?

Screenshot 2024-08-29 at 4 16 03 PM

julienw commented 1 month ago

I'm not sure why these other Navigation::Start have no payload at all. I would think this is a bug, that they should have a payload and a Page as well, but I'm not sure.

I totally agree that this is confusing. I'd go one step further than you, I think that we should only display those that are for the top level frame (we have this information as soon as we have the Page information). IMO the same issue happens for all other lines too, especially the Load.

The code to filter these markers is in https://github.com/firefox-devtools/profiler/blob/ac4ae1faca22a3c8f1075990bb5ddddf69ef6f34/src/profile-logic/marker-data.js#L1224-L1253

You can see that there's a special case for Navigation::Start without a payload. The third one has a payload but doesn't have a property "category", and it wouldn't be selected anyway. I think this simply hasn't been updated when the Page information was added in https://bugzilla.mozilla.org/show_bug.cgi?id=1701524.

Longer term we could add a value timeline-network to this enum: https://github.com/firefox-devtools/profiler/blob/ac4ae1faca22a3c8f1075990bb5ddddf69ef6f34/src/types/markers.js#L81 and use it.