diff --git a/website/src/components/DeviceCard/index.tsx b/website/src/components/DeviceCard/index.tsx index 13c316401d..e08ecd03cb 100644 --- a/website/src/components/DeviceCard/index.tsx +++ b/website/src/components/DeviceCard/index.tsx @@ -17,6 +17,7 @@ export default function DeviceCard(props: { className={`avatar__photo-link avatar__photo avatar__photo--xl ${styles.device__photo}`} alt={imageAlt || `photograph of ${title}`} src={image} + decoding="async" />
{title}
diff --git a/website/src/components/HeroImage/index.tsx b/website/src/components/HeroImage/index.tsx index 6f4a778d67..3bf1ef1ca3 100644 --- a/website/src/components/HeroImage/index.tsx +++ b/website/src/components/HeroImage/index.tsx @@ -12,6 +12,7 @@ export default function HeroImage() { loading="lazy" src={hero} alt="screenshot of the visual studio integration" + decoding="async" />
💖
@@ -25,7 +26,7 @@ export default function HeroImage() { })) .filter(({ img, url }) => !!img && !!url) .map(({ id, img, devName }) => ( - {devName} + {devName} ))} diff --git a/website/src/components/KeyGenerator/index.tsx b/website/src/components/KeyGenerator/index.tsx index dcb0dd23ee..b54f275f0b 100644 --- a/website/src/components/KeyGenerator/index.tsx +++ b/website/src/components/KeyGenerator/index.tsx @@ -1,4 +1,4 @@ -import React, { useState } from "react" +import React, { useState, useCallback } from "react" function toHex(bytes: Uint8Array) { let r = "" @@ -9,14 +9,14 @@ function toHex(bytes: Uint8Array) { } export default function KeyGenerator() { - const compute = () => { + const compute = useCallback(() => { if (typeof window === "undefined") return "00000000000000000000000000000000" const array = new Uint8Array(32) // Create a Uint8Array with 32 elements. window.crypto.getRandomValues(array) // Fill the array with cryptographically strong random values. return toHex(array) - } + }, []) const [value, setValue] = useState(compute())