search

sitespeedio / browsertime

Measure and Optimize Web Performance
https://www.sitespeed.io/documentation/browsertime/
Apache License 2.0
608 stars 137 forks source link

Why is FCP greater than LCP ? #2200

Open pschonmann opened 1 day ago

pschonmann commented 1 day ago

Your question

FCP is greater than LCP, that doesnt make sense

root@docker1:~# docker run --rm -v "$(pwd)":/sitespeed.io sitespeedio/sitespeed.io:latest https://www.argul.cz -b chrome
Google Chrome 130.0.6723.58 
Mozilla Firefox 131.0
Microsoft Edge 129.0.2792.89 
[2024-11-07 02:04:29] INFO: Versions OS: linux 5.10.0-28-amd64 nodejs: v20.17.0 sitespeed.io: 35.3.1 browsertime: 23.2.0 coach: 8.0.2
[2024-11-07 02:04:29] INFO: Running tests using Chrome - 3 iteration(s)
[2024-11-07 02:04:30] INFO: Testing url https://www.argul.cz iteration 1
[2024-11-07 02:04:40] INFO: Take after page complete check screenshot
[2024-11-07 02:04:41] INFO: Take cumulative layout shift screenshot
[2024-11-07 02:04:42] INFO: Take largest contentful paint screenshot
[2024-11-07 02:04:45] INFO: Use the visual metrics portable script
[2024-11-07 02:04:45] INFO: Get visual metrics from the video
[2024-11-07 02:04:49] INFO: https://www.argul.cz TTFB: 117ms DOMContentLoaded: 674ms firstPaint: 494ms FCP: 494ms LCP: 420ms Load: 1.05s CLS:0.0021
[2024-11-07 02:04:49] INFO: VisualMetrics: FirstVisualChange: 500ms SpeedIndex: 1.35s VisualComplete85: 700ms LastVisualChange: 6.63s
[2024-11-07 02:04:49] INFO: Testing url https://www.argul.cz iteration 2
[2024-11-07 02:05:00] INFO: Take after page complete check screenshot
[2024-11-07 02:05:00] INFO: Take cumulative layout shift screenshot
[2024-11-07 02:05:01] INFO: Take largest contentful paint screenshot
[2024-11-07 02:05:04] INFO: Use the visual metrics portable script
[2024-11-07 02:05:04] INFO: Get visual metrics from the video
[2024-11-07 02:05:08] INFO: https://www.argul.cz TTFB: 110ms DOMContentLoaded: 625ms firstPaint: 496ms FCP: 496ms LCP: 407ms Load: 823ms CLS:0.0021
[2024-11-07 02:05:08] INFO: VisualMetrics: FirstVisualChange: 500ms SpeedIndex: 1.32s VisualComplete85: 666ms LastVisualChange: 6.43s
[2024-11-07 02:05:09] INFO: Testing url https://www.argul.cz iteration 3
[2024-11-07 02:05:19] INFO: Take after page complete check screenshot
[2024-11-07 02:05:20] INFO: Take cumulative layout shift screenshot
[2024-11-07 02:05:20] INFO: Take largest contentful paint screenshot
[2024-11-07 02:05:23] INFO: Use the visual metrics portable script
[2024-11-07 02:05:23] INFO: Get visual metrics from the video
[2024-11-07 02:05:27] INFO: https://www.argul.cz TTFB: 133ms DOMContentLoaded: 632ms firstPaint: 496ms FCP: 496ms LCP: 415ms Load: 825ms CLS:0.0021
[2024-11-07 02:05:27] INFO: VisualMetrics: FirstVisualChange: 500ms SpeedIndex: 1.33s VisualComplete85: 700ms LastVisualChange: 6.43s
[2024-11-07 02:05:27] INFO: https://www.argul.cz 76 requests, TTFB: 117ms (σ10.00ms 8.0%), firstPaint: 496ms (σ1.00ms 0.2%), firstVisualChange: 500ms (σ0.00ms 0%), FCP: 496ms (σ1.00ms 0.2%), DOMContentLoaded: 632ms (σ22.00ms 3.4%), LCP: 415ms (σ5.00ms 1.3%), CLS: 0.0021 (σ0.00 0%), TBT: 0ms (σ0.00ms 0%), CPUBenchmark: 43ms (σ3.00ms 7.7%), Load: 825ms (σ107.00ms 11.9%), speedIndex: 1.33s (σ13.00ms 1.0%), visualComplete85: 700ms (σ16.00ms 2.3%), lastVisualChange: 6.43s (σ94.00ms 1.5%) (3 runs)
[2024-11-07 02:05:28] INFO: The server responded with a 404 status code for https://www.argul.cz/favicon-16x16.png
[2024-11-07 02:05:28] INFO: The server responded with a 404 status code for https://www.argul.cz/favicon-16x16.png
[2024-11-07 02:05:28] INFO: The server responded with a 404 status code for https://www.argul.cz/favicon-16x16.png
soulgalore commented 22 hours ago

Hi @pschonmann check if the LCP element is the correct element. If so, you can report Chrome bugs direct in https://issues.chromium.org/issues . If it seems to be the wrong element for LCP, let me know.

pschonmann commented 20 hours ago

Im not sure if its only chromium thing. Im getting these weird results in Firefox and Edge -b option too. Anyway LCP seems to be identified okay. In chromium ctrl+shift+i and performace tab - LCP > img - same match as LCP on html report in first run.

root@docker1:~# docker run --rm -v "$(pwd)":/sitespeed.io sitespeedio/sitespeed.io:latest https://www.argul.cz -b firefox -n 1
Google Chrome 130.0.6723.58 
Mozilla Firefox 131.0
Microsoft Edge 129.0.2792.89 
[2024-11-07 06:34:59] INFO: Versions OS: linux 5.10.0-28-amd64 nodejs: v20.17.0 sitespeed.io: 35.3.1 browsertime: 23.2.0 coach: 8.0.2
[2024-11-07 06:34:59] INFO: Running tests using Firefox - 1 iteration(s)
[2024-11-07 06:35:01] INFO: Testing url https://www.argul.cz iteration 1
[2024-11-07 06:35:11] INFO: Take after page complete check screenshot
[2024-11-07 06:35:12] INFO: Take largest contentful paint screenshot
[2024-11-07 06:35:16] INFO: Use the visual metrics portable script
[2024-11-07 06:35:16] INFO: Get visual metrics from the video
[2024-11-07 06:35:20] INFO: https://www.argul.cz 86 requests, TTFB: 257ms, firstPaint: 825ms, firstVisualChange: 867ms, FCP: 813ms, DOMContentLoaded: 784ms, LCP: 684ms, CPUBenchmark: 60ms, Load: 1.12s, speedIndex: 1.73s, visualComplete85: 1.63s, lastVisualChange: 6.70s
[2024-11-07 06:35:20] INFO: The server responded with a 404 status code for https://popup-server.azurewebsites.net/zbozi/company/review/...
[2024-11-07 06:35:22] INFO: HTML stored in /sitespeed.io/sitespeed-result/www.argul.cz/2024-11-07-06-34-59
root@docker1:~# docker run --rm -v "$(pwd)":/sitespeed.io sitespeedio/sitespeed.io:latest https://www.argul.cz -b edge -n 1
Google Chrome 130.0.6723.58 
Mozilla Firefox 131.0
Microsoft Edge 129.0.2792.89 
[2024-11-07 06:35:33] INFO: Versions OS: linux 5.10.0-28-amd64 nodejs: v20.17.0 sitespeed.io: 35.3.1 browsertime: 23.2.0 coach: 8.0.2
[2024-11-07 06:35:33] INFO: Running tests using Edge - 1 iteration(s)
[2024-11-07 06:35:33] INFO: Using Edge is experimental at the moment and use the same configuration as for Chrome
[2024-11-07 06:35:34] INFO: Testing url https://www.argul.cz iteration 1
[2024-11-07 06:35:45] INFO: Take after page complete check screenshot
[2024-11-07 06:35:45] INFO: Take cumulative layout shift screenshot
[2024-11-07 06:35:46] INFO: Take largest contentful paint screenshot
[2024-11-07 06:35:49] INFO: Use the visual metrics portable script
[2024-11-07 06:35:49] INFO: Get visual metrics from the video
[2024-11-07 06:35:53] INFO: https://www.argul.cz 76 requests, TTFB: 155ms, firstPaint: 540ms, firstVisualChange: 533ms, FCP: 540ms, DOMContentLoaded: 768ms, LCP: 427ms, CLS: 0.0021, TBT: 0ms, CPUBenchmark: 41ms, Load: 928ms, speedIndex: 1.39s, visualComplete85: 733ms, lastVisualChange: 6.57s
[2024-11-07 06:35:54] INFO: The server responded with a 404 status code for https://www.argul.cz/favicon-16x16.png
[2024-11-07 06:35:55] INFO: HTML stored in /sitespeed.io/sitespeed-result/www.argul.cz/2024-11-07-06-35-33
soulgalore commented 20 hours ago

Edge and Chrome use same codebase. You can report bugs for Firefox in https://bugzilla.mozilla.org. So the FCP and LCP is picked up from the browsers API:s, checkout https://w3c.github.io/paint-timing/#first-contentful-paint and https://w3c.github.io/largest-contentful-paint/#sec-largest-contentful-paint-interface, the values are not touched in Browsertime/sitespeed.io, they are picked up directly from the browser.

pschonmann commented 16 hours ago

https://issues.chromium.org/issues/377724738