HTTPArchive / custom-metrics

Custom metrics to use with WebPageTest agents
Apache License 2.0
19 stars 22 forks source link

Test LCP viewport stat #103

Closed rviscomi closed 9 months ago

rviscomi commented 9 months ago

Fixes for the performance custom metric:

Also outputs the LCP viewport percentage as a standalone field

Test websites:

github-actions[bot] commented 9 months ago
Custom metrics for https://almanac.httparchive.org/en/2022/ WPT test run results: http://webpagetest.httparchive.org/results.php?test=231207_D8_A
Custom metrics for https://maxiclimber.com/ WPT test run results: http://webpagetest.httparchive.org/results.php?test=231207_16_C Changed custom metrics values: ```json { "_performance": { "lcp_elem_stats": { "startTime": 6342.10000000149, "nodeName": "VIDEO", "url": "https://cdn.shopify.com/videos/c/o/v/8557b5c7914741a9a08bae8e565a481c.mp4", "size": 661388, "loadTime": 0, "renderTime": 6342.10000000149, "attributes": [ { "name": "src", "value": "https://cdn.shopify.com/videos/c/o/v/8557b5c7914741a9a08bae8e565a481c.mp4" }, { "name": "autoplay", "value": "" }, { "name": "loop", "value": "" }, { "name": "playsinline", "value": "" }, { "name": "muted", "value": "" } ], "boundingClientRect": { "x": 0, "y": 16.65625, "width": 1351, "height": 768.375, "top": 16.65625, "right": 1351, "bottom": 785.03125, "left": 0 }, "styles": { "background-image": "none", "pointer-events": "none", "position": "absolute", "width": "1351px", "height": "768.375px" }, "percentOfViewport": "0.965", "cover90viewport": true }, "raw_lcp_element": null, "lcp_resource": { "id": "16229.193", "sequence": 61, "body": "/home/pmeenan/wptagent/work/wptagent-manual-221206-10.240.0.22/231207_16_C.1.0/bodies/16229.193", "url": "https://cdn.shopify.com/videos/c/o/v/8557b5c7914741a9a08bae8e565a481c.mp4", "status": 206, "connectionId": 0, "protocol": "h3", "connectionReused": true, "fromServiceWorker": false, "timing": { "requestTime": 38354.382427, "proxyStart": -1, "proxyEnd": -1, "dnsStart": -1, "dnsEnd": -1, "connectStart": -1, "connectEnd": -1, "sslStart": -1, "sslEnd": -1, "workerStart": -1, "workerReady": -1, "workerFetchStart": -1, "workerRespondWithSettled": -1, "sendStart": 0.705, "sendEnd": 1.053, "pushStart": 0, "pushEnd": 0, "receiveHeadersStart": 2227.119, "receiveHeadersEnd": 2227.702 }, "fromDiskCache": false, "remoteIPAddress": "23.227.60.200", "remotePort": 443, "securityState": "secure", "securityDetails": { "protocol": "QUIC", "keyExchange": "", "keyExchangeGroup": "X25519", "cipher": "AES_128_GCM", "certificateId": 0, "subjectName": "cdn.shopify.com", "sanList": [ "cdn.shopify.com" ], "issuer": "E1", "validFrom": 1699448711, "validTo": 1707224710, "signedCertificateTimestampList": [ { "status": "Verified", "origin": "Embedded in certificate", "logDescription": "DigiCert Yeti2024 Log", "logId": "48B0E36BDAA647340FE56A02FA9D30EB1C5201CB56DD2C81D9BBBFAB39D88473", "timestamp": 1699452311914, "hashAlgorithm": "SHA-256", "signatureAlgorithm": "ECDSA", "signatureData": "3044022070335A8958AF0F84E07637850537D419000DA8CD38FE01C6A20CFF00A41EC9FE02207521441C74BC878265E84568E5A490DAD9963C43F0E2D72BE8C9E495F7DAFA08" }, { "status": "Verified", "origin": "Embedded in certificate", "logDescription": "Google 'Xenon2024' log", "logId": "76FF883F0AB6FB9551C261CCF587BA34B4A4CDBB29DC68420A9FE6674C5A3A74", "timestamp": 1699452311995, "hashAlgorithm": "SHA-256", "signatureAlgorithm": "ECDSA", "signatureData": "304402206B60D739B18AC35BDC4CC5939DE6629E4CE73BF0D945813996049310A5CB631102202CD8AF4F055E18E4481B91B3F8A6B7B5836A43F10328CB02E6F79D80E5E3B863" } ], "certificateTransparencyCompliance": "compliant", "serverSignatureAlgorithm": 1027, "encryptedClientHello": false }, "fromPrefetchCache": false, "response_headers": { "Content-Length": "3022466", "Content-Range": "bytes 0-3022465/3022466", "access-control-allow-origin": "*", "age": "148242", "alt-svc": "h3=\":443\"; ma=86400", "cache-control": "public, max-age=31536000", "cf-cache-status": "HIT", "cf-ray": "831d71955e796908-IAD", "content-type": "video/mp4", "date": "Thu, 07 Dec 2023 14:26:26 GMT", "last-modified": "Wed, 29 Nov 2023 10:15:48 GMT", "link": "; rel=\"canonical\"", "nel": "{\"success_fraction\":0.01,\"report_to\":\"cf-nel\",\"max_age\":604800}", "report-to": "{\"endpoints\":[{\"url\":\"https:\\/\\/a.nel.cloudflare.com\\/report\\/v3?s=ftROSWFwbE6OkP%2FnjWEQwIO1zxe1mocowO7hqfTsgvoAD71ZkFD%2B285Qd7sTnnJ2L7ZIn0yTrRkykMcSardzuPiUtEq9vBtllLRmtaIFrbSY4GMHQeA6iupn1vG0ZIxXtw%3D%3D\"}],\"group\":\"cf-nel\",\"max_age\":604800}", "server": "cloudflare", "server-timing": "imagery;dur=161.887\nimageryFetch;dur=161.557\ncfRequestDuration;dur=14.999866", "strict-transport-security": "max-age=15552000; includeSubDomains; preload", "timing-allow-origin": "*", "vary": "Accept-Encoding", "x-content-type-options": "nosniff", "x-dc": "gcp-us-east1,gcp-us-central1", "x-request-id": "3cd85954-f638-4f9a-be7b-b20431c27ea3", "x-xss-protection": "1; mode=block" }, "request_headers": { ":authority": "cdn.shopify.com", ":method": "GET", ":path": "/videos/c/o/v/8557b5c7914741a9a08bae8e565a481c.mp4", ":scheme": "https", "accept": "*/*", "accept-encoding": "identity;q=1, *;q=0", "accept-language": "en-US,en;q=0.9", "range": "bytes=0-", "referer": "https://maxiclimber.com/", "sec-ch-ua": "\" Not A;Brand\";v=\"99\", \"Chromium\";v=\"120\", \"Google Chrome\";v=\"120\"", "sec-ch-ua-mobile": "?0", "sec-ch-ua-platform": "\"Unknown\"", "sec-fetch-dest": "video", "sec-fetch-mode": "no-cors", "sec-fetch-site": "cross-site", "user-agent": "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36 PTST/231204.170811" }, "initiator": { "type": "parser", "url": "https://maxiclimber.com/", "lineNumber": 3297, "columnNumber": 122 }, "documentURL": "https://maxiclimber.com/", "timestamp": 38354.381815, "frameId": "1EB9385F298890BBA1CF778E1692B27F", "hasUserGesture": false, "type": "Media", "wallTime": 1701959186.750988, "initialPriority": "Low", "priority": "Low", "transfer_size": 3024715 }, "is_lcp_statically_discoverable": false, "is_lcp_preloaded": false, "lcp_preload": [], "web_vitals_js": [ "https://maxiclimber.com/cdn/shopifycloud/boomerang/shopify-boomerang-1.0.0.min.js", "https://cdn.shopify.com/shopifycloud/checkout-web/assets/441.latest.en.04eff29e3df2d466c911.js" ], "gaming_metrics": { "fidIframeOverlaySoft": false, "lcpOverlaySoft": true } } } ```
Custom metrics for https://fancy-confused-apparel.glitch.me/ WPT test run results: http://webpagetest.httparchive.org/results.php?test=231207_N2_D Changed custom metrics values: ```json { "_performance": { "lcp_elem_stats": { "startTime": 286.79999999701977, "nodeName": "DIV", "url": "", "size": 314028, "loadTime": 0, "renderTime": 286.79999999701977, "attributes": [ { "name": "class", "value": "theme-wv" } ], "boundingClientRect": { "x": 10, "y": 10, "width": 1346, "height": 671, "top": 10, "right": 1356, "bottom": 681, "left": 10 }, "styles": { "background-image": "none", "pointer-events": "none", "position": "fixed", "width": "1346px", "height": "671px" }, "percentOfViewport": "0.957", "cover90viewport": true }, "raw_lcp_element": null, "lcp_resource": null, "is_lcp_statically_discoverable": true, "is_lcp_preloaded": null, "lcp_preload": null, "web_vitals_js": [], "gaming_metrics": { "lcpOverlaySoft": true } } } ```