{ "fetchTime": "2026-08-20T02:44:57.801Z", "requestedUrl": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "finalUrl": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "lighthouseVersion": "13.4.1", "environment": { "networkUserAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/151.0.0.0 Safari/537.36", "hostUserAgent": "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/151.0.7922.71 Safari/537.36", "benchmarkIndex": 907.5, "credits": { "axe-core": "4.12.1" } }, "userAgent": "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/151.0.7922.71 Safari/537.36", "runWarnings": [], "audits": { "accesskeys": { "id": "accesskeys", "title": "`[accesskey]` values are unique", "description": "Access keys let users quickly focus a part of the page. For proper navigation, each access key must be unique. [Learn more about access keys](https://dequeuniversity.com/rules/axe/4.12/accesskeys).", "score": null, "scoreDisplayMode": "notApplicable" }, "agent-accessibility-tree": { "id": "agent-accessibility-tree", "title": "Accessibility tree is well-formed", "description": "A well-formed [accessibility tree](https://developer.chrome.com/docs/lighthouse/agentic-browsing/accessibility-for-agents) helps AI agents to navigate and interact with the page.", "score": 1, "scoreDisplayMode": "binary", "displayValue": "All audits passed" }, "aria-allowed-attr": { "id": "aria-allowed-attr", "title": "`[aria-*]` attributes match their roles", "description": "Each ARIA `role` supports a specific subset of `aria-*` attributes. Mismatching these invalidates the `aria-*` attributes. [Learn how to match ARIA attributes to their roles](https://dequeuniversity.com/rules/axe/4.12/aria-allowed-attr).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-allowed-role": { "id": "aria-allowed-role", "title": "Uses ARIA roles only on compatible elements", "description": "Many HTML elements can only be assigned certain ARIA roles. Using ARIA roles where they are not allowed can interfere with the accessibility of the web page. [Learn more about ARIA roles](https://dequeuniversity.com/rules/axe/4.12/aria-allowed-role).", "score": null, "scoreDisplayMode": "notApplicable" }, "aria-command-name": { "id": "aria-command-name", "title": "`button`, `link`, and `menuitem` elements have accessible names", "description": "When an element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. [Learn how to make command elements more accessible](https://dequeuniversity.com/rules/axe/4.12/aria-command-name).", "score": null, "scoreDisplayMode": "notApplicable" }, "aria-conditional-attr": { "id": "aria-conditional-attr", "title": "ARIA attributes are used as specified for the element's role", "description": "Some ARIA attributes are only allowed on an element under certain conditions. [Learn more about conditional ARIA attributes](https://dequeuniversity.com/rules/axe/4.12/aria-conditional-attr).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-deprecated-role": { "id": "aria-deprecated-role", "title": "Deprecated ARIA roles were not used", "description": "Deprecated ARIA roles may not be processed correctly by assistive technology. [Learn more about deprecated ARIA roles](https://dequeuniversity.com/rules/axe/4.12/aria-deprecated-role).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-dialog-name": { "id": "aria-dialog-name", "title": "Elements with `role=\"dialog\"` or `role=\"alertdialog\"` have accessible names.", "description": "ARIA dialog elements without accessible names may prevent screen readers users from discerning the purpose of these elements. [Learn how to make ARIA dialog elements more accessible](https://dequeuniversity.com/rules/axe/4.12/aria-dialog-name).", "score": null, "scoreDisplayMode": "notApplicable" }, "aria-hidden-body": { "id": "aria-hidden-body", "title": "`[aria-hidden=\"true\"]` is not present on the document ``", "description": "Assistive technologies, like screen readers, work inconsistently when `aria-hidden=\"true\"` is set on the document ``. [Learn how `aria-hidden` affects the document body](https://dequeuniversity.com/rules/axe/4.12/aria-hidden-body).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-hidden-focus": { "id": "aria-hidden-focus", "title": "`[aria-hidden=\"true\"]` elements do not contain focusable descendents", "description": "Focusable descendents within an `[aria-hidden=\"true\"]` element prevent those interactive elements from being available to users of assistive technologies like screen readers. [Learn how `aria-hidden` affects focusable elements](https://dequeuniversity.com/rules/axe/4.12/aria-hidden-focus).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-input-field-name": { "id": "aria-input-field-name", "title": "ARIA input fields have accessible names", "description": "When an input field doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. [Learn more about input field labels](https://dequeuniversity.com/rules/axe/4.12/aria-input-field-name).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-meter-name": { "id": "aria-meter-name", "title": "ARIA `meter` elements have accessible names", "description": "When a meter element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. [Learn how to name `meter` elements](https://dequeuniversity.com/rules/axe/4.12/aria-meter-name).", "score": null, "scoreDisplayMode": "notApplicable" }, "aria-progressbar-name": { "id": "aria-progressbar-name", "title": "ARIA `progressbar` elements have accessible names", "description": "When a `progressbar` element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. [Learn how to label `progressbar` elements](https://dequeuniversity.com/rules/axe/4.12/aria-progressbar-name).", "score": null, "scoreDisplayMode": "notApplicable" }, "aria-prohibited-attr": { "id": "aria-prohibited-attr", "title": "Elements use only permitted ARIA attributes", "description": "Using ARIA attributes in roles where they are prohibited can mean that important information is not communicated to users of assistive technologies. [Learn more about prohibited ARIA roles](https://dequeuniversity.com/rules/axe/4.12/aria-prohibited-attr).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-required-attr": { "id": "aria-required-attr", "title": "`[role]`s have all required `[aria-*]` attributes", "description": "Some ARIA roles have required attributes that describe the state of the element to screen readers. [Learn more about roles and required attributes](https://dequeuniversity.com/rules/axe/4.12/aria-required-attr).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-required-children": { "id": "aria-required-children", "title": "Elements with an ARIA `[role]` that require children to contain a specific `[role]` have all required children.", "description": "Some ARIA parent roles must contain specific child roles to perform their intended accessibility functions. [Learn more about roles and required children elements](https://dequeuniversity.com/rules/axe/4.12/aria-required-children).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-required-parent": { "id": "aria-required-parent", "title": "`[role]`s are contained by their required parent element", "description": "Some ARIA child roles must be contained by specific parent roles to properly perform their intended accessibility functions. [Learn more about ARIA roles and required parent element](https://dequeuniversity.com/rules/axe/4.12/aria-required-parent).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-roles": { "id": "aria-roles", "title": "`[role]` values are valid", "description": "ARIA roles must have valid values in order to perform their intended accessibility functions. [Learn more about valid ARIA roles](https://dequeuniversity.com/rules/axe/4.12/aria-roles).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-text": { "id": "aria-text", "title": "Elements with the `role=text` attribute do not have focusable descendents.", "description": "Adding `role=text` around a text node split by markup enables VoiceOver to treat it as one phrase, but the element's focusable descendents will not be announced. [Learn more about the `role=text` attribute](https://dequeuniversity.com/rules/axe/4.12/aria-text).", "score": null, "scoreDisplayMode": "notApplicable" }, "aria-toggle-field-name": { "id": "aria-toggle-field-name", "title": "ARIA toggle fields have accessible names", "description": "When a toggle field doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. [Learn more about toggle fields](https://dequeuniversity.com/rules/axe/4.12/aria-toggle-field-name).", "score": null, "scoreDisplayMode": "notApplicable" }, "aria-tooltip-name": { "id": "aria-tooltip-name", "title": "ARIA `tooltip` elements have accessible names", "description": "When a tooltip element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. [Learn how to name `tooltip` elements](https://dequeuniversity.com/rules/axe/4.12/aria-tooltip-name).", "score": null, "scoreDisplayMode": "notApplicable" }, "aria-treeitem-name": { "id": "aria-treeitem-name", "title": "ARIA `treeitem` elements have accessible names", "description": "When a `treeitem` element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. [Learn more about labeling `treeitem` elements](https://dequeuniversity.com/rules/axe/4.12/aria-treeitem-name).", "score": null, "scoreDisplayMode": "notApplicable" }, "aria-valid-attr": { "id": "aria-valid-attr", "title": "`[aria-*]` attributes are valid and not misspelled", "description": "Assistive technologies, like screen readers, can't interpret ARIA attributes with invalid names. [Learn more about valid ARIA attributes](https://dequeuniversity.com/rules/axe/4.12/aria-valid-attr).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "aria-valid-attr-value": { "id": "aria-valid-attr-value", "title": "`[aria-*]` attributes have valid values", "description": "Assistive technologies, like screen readers, can't interpret ARIA attributes with invalid values. [Learn more about valid values for ARIA attributes](https://dequeuniversity.com/rules/axe/4.12/aria-valid-attr-value).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "autocomplete-valid": { "id": "autocomplete-valid", "title": "`autocomplete` attributes are used correctly", "description": "The `autocomplete` attribute values must be valid and correctly applied for screen readers to function correctly. [Learn more about valid autocomplete values](https://dequeuniversity.com/rules/axe/4.12/autocomplete-valid).", "score": null, "scoreDisplayMode": "notApplicable" }, "baseline": { "id": "baseline", "title": "Baseline Features", "description": "Lists web features used on the page and their Baseline status as of 2026-07-15. [Learn more about Baseline](https://webstatus.dev/).", "score": 1, "scoreDisplayMode": "informative", "details": { "headings": [ { "key": "featureId", "label": "Web-features", "valueType": "link" }, { "key": "displayStatus", "label": "Baseline Status", "valueType": "baseline-status" }, { "key": "source", "label": "Source", "valueType": "source-location" } ], "items": [ { "displayStatus": { "displayString": "Limited Availability", "status": "limited", "type": "baseline-status" }, "featureId": { "text": "ua-client-hints", "type": "link", "url": "https://webstatus.dev/features/ua-client-hints" }, "source": { "column": 121, "line": 726, "type": "source-location", "url": "https://www.googletagmanager.com/gtag/js?id=G-B1E83PJ3RT", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Limited Availability", "status": "limited", "type": "baseline-status" }, "featureId": { "text": "background-clip-text", "type": "link", "url": "https://webstatus.dev/features/background-clip-text" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Newly Available (2025-12-12)", "status": "low", "type": "baseline-status" }, "featureId": { "text": "scrollbar-color", "type": "link", "url": "https://webstatus.dev/features/scrollbar-color" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Newly Available (2025-12-12)", "status": "low", "type": "baseline-status" }, "featureId": { "text": "scrollend", "type": "link", "url": "https://webstatus.dev/features/scrollend" }, "source": { "column": 178218, "line": 0, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/_next/static/immutable/chunks/30ijxbpfog646.js", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Newly Available (2024-12-11)", "status": "low", "type": "baseline-status" }, "featureId": { "text": "scrollbar-width", "type": "link", "url": "https://webstatus.dev/features/scrollbar-width" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Newly Available (2024-10-29)", "status": "low", "type": "baseline-status" }, "featureId": { "text": "fetch-priority", "type": "link", "url": "https://webstatus.dev/features/fetch-priority" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Newly Available (2024-09-16)", "status": "low", "type": "baseline-status" }, "featureId": { "text": "backdrop-filter", "type": "link", "url": "https://webstatus.dev/features/backdrop-filter" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2023-10-24)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "aria-attribute-reflection", "type": "link", "url": "https://webstatus.dev/features/aria-attribute-reflection" }, "source": { "column": 11923, "line": 0, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/_next/static/immutable/chunks/30ijxbpfog646.js", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2023-03-27)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "outline", "type": "link", "url": "https://webstatus.dev/features/outline" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2022-09-12)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "overflow-clip", "type": "link", "url": "https://webstatus.dev/features/overflow-clip" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2022-03-14)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "focus-visible", "type": "link", "url": "https://webstatus.dev/features/focus-visible" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2022-03-14)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "appearance", "type": "link", "url": "https://webstatus.dev/features/appearance" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2022-02-03)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "color-scheme", "type": "link", "url": "https://webstatus.dev/features/color-scheme" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2021-09-20)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "logical-properties", "type": "link", "url": "https://webstatus.dev/features/logical-properties" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2021-09-20)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "referrer-policy", "type": "link", "url": "https://webstatus.dev/features/referrer-policy" } }, { "displayStatus": { "displayString": "Widely Available (2021-09-20)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "aspect-ratio", "type": "link", "url": "https://webstatus.dev/features/aspect-ratio" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2021-01-21)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "not", "type": "link", "url": "https://webstatus.dev/features/not" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2021-01-21)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "where", "type": "link", "url": "https://webstatus.dev/features/where" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2021-01-21)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "is", "type": "link", "url": "https://webstatus.dev/features/is" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2021-01-21)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "clip-path", "type": "link", "url": "https://webstatus.dev/features/clip-path" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2020-09-16)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "webp", "type": "link", "url": "https://webstatus.dev/features/webp" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2020-09-16)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "nullish-coalescing", "type": "link", "url": "https://webstatus.dev/features/nullish-coalescing" }, "source": { "column": 0, "line": 242, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2020-09-16)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "logical-assignments", "type": "link", "url": "https://webstatus.dev/features/logical-assignments" }, "source": { "column": 0, "line": 242, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2020-01-15)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "slot", "type": "link", "url": "https://webstatus.dev/features/slot" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2019-03-25)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "intersection-observer", "type": "link", "url": "https://webstatus.dev/features/intersection-observer" }, "source": { "column": 10365, "line": 0, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/_next/static/immutable/chunks/2hjihpwk2vynk.js", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2019-03-25)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "aborting", "type": "link", "url": "https://webstatus.dev/features/aborting" }, "source": { "column": 65952, "line": 0, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/_next/static/immutable/chunks/30ijxbpfog646.js", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2017-10-17)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "grid", "type": "link", "url": "https://webstatus.dev/features/grid" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2015-11-12)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "template", "type": "link", "url": "https://webstatus.dev/features/template" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2015-09-30)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "flexbox", "type": "link", "url": "https://webstatus.dev/features/flexbox" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2015-07-29)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "request-animation-frame", "type": "link", "url": "https://webstatus.dev/features/request-animation-frame" }, "source": { "column": 37457, "line": 203, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } }, { "displayStatus": { "displayString": "Widely Available (2015-07-29)", "status": "high", "type": "baseline-status" }, "featureId": { "text": "text-indent", "type": "link", "url": "https://webstatus.dev/features/text-indent" }, "source": { "column": -2, "line": -2, "type": "source-location", "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component", "urlProvider": "network" } } ], "type": "table" } }, "bootup-time": { "id": "bootup-time", "title": "Reduce JavaScript execution time", "description": "Consider reducing the time spent parsing, compiling, and executing JS. You may find delivering smaller JS payloads helps with this. [Learn how to reduce Javascript execution time](https://developer.chrome.com/docs/lighthouse/performance/bootup-time/).", "score": 0, "scoreDisplayMode": "metricSavings", "displayValue": "2.1 s", "details": { "headings": [ { "key": "url", "label": "URL", "valueType": "url" }, { "granularity": 1, "key": "total", "label": "Total CPU Time", "valueType": "ms" }, { "granularity": 1, "key": "scripting", "label": "Script Evaluation", "valueType": "ms" }, { "granularity": 1, "key": "scriptParseCompile", "label": "Script Parse", "valueType": "ms" } ], "items": [ { "scriptParseCompile": 0, "scripting": 1345.5429999999956, "total": 1688.4599999999955, "url": "Unattributable" }, { "scriptParseCompile": 21.599, "scripting": 305.8770000000017, "total": 344.81100000000174, "url": "https://react-92rkf6322-react-foundation.vercel.app/_next/static/immutable/chunks/30ijxbpfog646.js" }, { "scriptParseCompile": 8.873000000000001, "scripting": 32.81799999999996, "total": 242.164, "url": "https://react-92rkf6322-react-foundation.vercel.app/learn/your-first-component" }, { "scriptParseCompile": 16.121, "scripting": 115.13900000000002, "total": 137.81900000000002, "url": "https://786946de.sandpack-bundler-4bw.pages.dev/index.af0b290c.js" }, { "scriptParseCompile": 6.669, "scripting": 96.15399999999997, "total": 134.80899999999997, "url": "https://react-92rkf6322-react-foundation.vercel.app/_next/static/immutable/chunks/2hjihpwk2vynk.js" }, { "scriptParseCompile": 28.693, "scripting": 69.25700000000012, "total": 100.44500000000012, "url": "https://www.googletagmanager.com/gtag/js?id=G-B1E83PJ3RT" }, { "scriptParseCompile": 9.561, "scripting": 55.7510000000001, "total": 65.4970000000001, "url": "https://react-92rkf6322-react-foundation.vercel.app/_next/static/immutable/chunks/3s4h91omq6x6f.js" } ], "sortedBy": [ "total" ], "summary": { "wastedMs": 2112.0549999999976 }, "type": "table" }, "numericValue": 2112.0549999999976, "numericUnit": "millisecond", "metricSavings": { "TBT": 1350 }, "guidanceLevel": 1 }, "button-name": { "id": "button-name", "title": "Buttons have an accessible name", "description": "When a button doesn't have an accessible name, screen readers announce it as \"button\", making it unusable for users who rely on screen readers. [Learn how to make buttons more accessible](https://dequeuniversity.com/rules/axe/4.12/button-name).", "score": 1, "scoreDisplayMode": "binary", "details": { "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [], "type": "table" } }, "bypass": { "id": "bypass", "title": "The page contains a heading, skip link, or landmark region", "description": "Adding ways to bypass repetitive content lets keyboard users navigate the page more efficiently. [Learn more about bypass blocks](https://dequeuniversity.com/rules/axe/4.12/bypass).", "score": null, "scoreDisplayMode": "notApplicable" }, "cache-insight": { "id": "cache-insight", "title": "Use efficient cache lifetimes", "description": "A long cache lifetime can speed up repeat visits to your page. [Learn more about caching](https://developer.chrome.com/docs/performance/insights/cache).", "score": 1, "scoreDisplayMode": "metricSavings", "details": { "debugData": { "type": "debugdata", "wastedBytes": 0 }, "headings": [ { "key": "url", "label": "Request", "valueType": "url" }, { "displayUnit": "duration", "key": "cacheLifetimeMs", "label": "Cache TTL", "valueType": "ms" }, { "displayUnit": "kb", "granularity": 1, "key": "totalBytes", "label": "Transfer Size", "valueType": "bytes" } ], "items": [], "type": "table" }, "metricSavings": { "LCP": 0, "FCP": 0 }, "guidanceLevel": 3 }, "canonical": { "id": "canonical", "title": "Document has a valid `rel=canonical`", "description": "Canonical links suggest which URL to show in search results. [Learn more about canonical links](https://developer.chrome.com/docs/lighthouse/seo/canonical/).", "score": 1, "scoreDisplayMode": "binary" }, "charset": { "id": "charset", "title": "Properly defines charset", "description": "A character encoding declaration is required. It can be done with a `` tag in the first 1024 bytes of the HTML or in the Content-Type HTTP response header. [Learn more about declaring the character encoding](https://developer.chrome.com/docs/lighthouse/best-practices/charset/).", "score": 1, "scoreDisplayMode": "binary" }, "clickjacking-mitigation": { "id": "clickjacking-mitigation", "title": "Mitigate clickjacking with XFO or CSP", "description": "The `X-Frame-Options` (XFO) header or the `frame-ancestors` directive in the `Content-Security-Policy` (CSP) header control where a page can be embedded. These can mitigate clickjacking attacks by blocking some or all sites from embedding the page. [Learn more about mitigating clickjacking](https://developer.chrome.com/docs/lighthouse/best-practices/clickjacking-mitigation).", "score": 1, "scoreDisplayMode": "informative", "details": { "headings": [ { "key": "description", "label": "Description", "subItemsHeading": { "key": "description" }, "valueType": "text" }, { "key": "severity", "label": "Severity", "subItemsHeading": { "key": "severity" }, "valueType": "text" } ], "items": [ { "description": "No frame control policy found", "severity": "High" } ], "type": "table" } }, "cls-culprits-insight": { "id": "cls-culprits-insight", "title": "Layout shift culprits", "description": "Layout shifts occur when elements move absent any user interaction. [Investigate the causes of layout shifts](https://developer.chrome.com/docs/performance/insights/cls-culprit), such as elements being added, removed, or their fonts changing as the page loads.", "score": 1, "scoreDisplayMode": "numeric", "details": { "items": [], "type": "list" }, "metricSavings": { "CLS": 0 }, "guidanceLevel": 3 }, "color-contrast": { "id": "color-contrast", "title": "Background and foreground colors do not have a sufficient contrast ratio.", "description": "Low-contrast text is difficult or impossible for many users to read. [Learn how to provide sufficient color contrast](https://dequeuniversity.com/rules/axe/4.12/color-contrast).", "score": 0, "scoreDisplayMode": "binary", "details": { "debugData": { "impact": "serious", "tags": [ "cat.color", "wcag2aa", "wcag143", "TTv5", "TT13.c", "EN-301-549", "EN-9.1.4.3", "ACT", "RGAAv4", "RGAA-3.2.1" ], "type": "debugdata" }, "headings": [ { "key": "node", "label": "Failing Elements", "subItemsHeading": { "key": "relatedNode", "valueType": "node" }, "valueType": "node" } ], "items": [ { "node": { "boundingRect": { "bottom": 52, "height": 40, "left": 112, "right": 783, "top": 12, "width": 671 }, "explanation": "Fix any of the following:\n Element has insufficient color contrast of 2.2 (foreground color: #99a1b3, background color: #ebedef, font size: 11.3pt (15px), font weight: normal). Expected contrast ratio of 4.5:1", "lhId": "1-0-BUTTON", "nodeLabel": "Search\nCtrl\nK", "path": "1,HTML,1,BODY,2,DIV,0,NAV,0,DIV,1,DIV,0,BUTTON", "selector": "nav.duration-300 > div.flex > div.items-center > button.flex", "snippet": "