1899370 - Very slow loading https://www.darenc.gov in slow network conditions

Status: NEW

(Core :: Performance: General, defect)

Description

[Denis Palmeiro [:denispal]]

Attachment: out-3g.mp4

The website https://www.darenc.gov is very slow to fully load when simulated in slow network conditions. The biggest problem is the extremely long FCP time compared to chrome.

                                                                                                Chrome                 Firefox                 Speedup
responseStart:
-------------------------------------------------------------------------------------------------------------------------------------------------------
(  1)  https://www.darenc.gov                                                          |   1094.00 (+- 217)      |  1076.80 (+- 209)            1.57% |

firstContentfulPaint:
-------------------------------------------------------------------------------------------------------------------------------------------------------
(  1)  https://www.darenc.gov                                                          |  12044.00 (+-4623)      | 18992.60 (+-2240)          -57.69% |

largestContentfulPaint:
-------------------------------------------------------------------------------------------------------------------------------------------------------
(  1)  https://www.darenc.gov                                                          |  19856.00 (+-5166)      | 21894.80 (+-3474)          -10.27% |

pageLoadTime:
-------------------------------------------------------------------------------------------------------------------------------------------------------
(  1)  https://www.darenc.gov                                                          |  53893.20 (+-5808)      | 47873.60 (+-27855)           11.17% |

SpeedIndex:
-------------------------------------------------------------------------------------------------------------------------------------------------------
(  1)  https://www.darenc.gov                                                          |  24310.20 (+-6652)      | 26365.60 (+-1088)           -8.45% |

Simulated network conditions are: Down:1600kbit/s Up:768kbit/s RTT:150ms
Profile: https://share.firefox.dev/457FaoI

Comment 1

[Denis Palmeiro [:denispal]]

This site was taken from Crux top50m list. According to crux, it is within the top 1,000,000 websites.

Comment 2

[Bas Schouten (:bas.schouten)]

The Performance Impact Calculator has determined this bug's performance impact to be medium. If you'd like to request re-triage, you can reset the Performance Impact flag to "?" or needinfo the triage sheriff.

Platforms: Windows
Configuration: Specific but common
Page load impact: Severe
[x] Able to reproduce locally

Comment 3

[Bas Schouten (:bas.schouten)]

The difference for me here seems to be that Firefox waited for the large image to load whereas Chrome doesn't. Olli might have some insight here.

Comment 4

[Andrew Creskey [:acreskey]]

It looks like this is served with HTTP/3? (at least on desktop)
I know there are cases where Chrome will connect over HTTP/3 but we do not yet.

In that space Valentin just enabled the incremental priority flag for images (and document channel) in bug 1784496.

Comment 5

[Andrew Creskey [:acreskey]]

This is another big priorities change that recently landed and we haven't yet run experiments, tests on - Bug 1865040

Comment 6

[Olli Pettay [:smaug][[e-mail]]]

Is this still an issue?

Comment 7

[Andrew Creskey [:acreskey]]

Attachment: compare_www.darenc.gov.png

Using these network settings (Down:1600kbit/s Up:768kbit/s RTT:150ms) with RogersInAbox and a Samsung A54 I'm also seeing Chrome being faster at first visual change.
But note that Fenix looks to be competitive in overall Speedindex.

Chrome tends to start drawing content sooner whereas Fenix tends to draw it all at once.

Comment 8

[Andrew Creskey [:acreskey]]

In the browsertime coldpage load scenario, live site, I'm seeing both browsers download all the key resources over HTTP/2.

The large background image is given a network priority of "low" in Firefox
https://www.darenc.gov/home/showpublishedimage/16179/638185319004070000
and it ends up competing for bandwidth with these two images:
https://www.darenc.gov/home/showpublishedimage/15401/638030044317370000
https://www.darenc.gov/home/showpublishedimage/15387/638030044279870000

In Chrome I'm seeing the default priority header urgency for these images, (i.e. 3), which their dev tools describe as "High" for these requests.
Likely because they are the first 5 larger images:
https://docs.google.com/document/d/1bCDuq9H1ih9iNjgzyAL0gpwNFiEP4TZS-YLRp_RuMlc/edit
But as far as I can tell, in Chrome all of the images are also competing for bandwidth.