lower default image quality

components/Image/Image.tsx

@@ -4,6 +4,10 @@ import { styled } from "../../lib/styles/stitches.config";
 import type { ComponentProps } from "react";
 import type { ImageProps as NextImageProps, StaticImageData } from "next/image";
 
+// https://nextjs.org/docs/api-reference/next/image#optional-props
+const DEFAULT_QUALITY = 60;
+const DEFAULT_LAYOUT = "intrinsic";
+
 const Wrapper = styled("div", {
   lineHeight: 0,
 
@@ -25,24 +29,23 @@ const Image = ({
   src,
   width,
   height,
-  placeholder,
-  alt,
-  layout,
-  quality,
   priority,
+  alt = "",
+  quality = DEFAULT_QUALITY,
+  layout = DEFAULT_LAYOUT,
+  placeholder,
   href,
   className,
   ...rest
 }: ImageProps) => {
-  // passed directly into next/image: https://nextjs.org/docs/api-reference/next/image
   const imageProps: Partial<NextImageProps> = {
     width: typeof width === "string" ? Number.parseInt(width.replace("px", "")) : width,
     height: typeof height === "string" ? Number.parseInt(height.replace("px", "")) : height,
-    alt: alt || "",
-    layout: layout || "intrinsic",
-    quality: quality || 65,
     priority: !!priority,
-    loading: priority ? "eager" : "lazy",
+    alt,
+    quality,
+    layout,
+    placeholder,
   };
 
   if (typeof src === "object") {
@@ -50,10 +53,11 @@ const Image = ({
     const staticImg = src as StaticImageData;
 
     imageProps.src = staticImg;
-    // default to blur placeholder while loading
+    // default to blur placeholder while loading if it's been generated for us
     imageProps.placeholder = placeholder || (staticImg.blurDataURL ? "blur" : "empty");
   } else {
-    // regular path to jpg/png/etc. passed in, which makes explicit width and height required
+    // regular path to a file was passed in, which makes explicit width and height required.
+    // optionally prepending src with "/public" makes images resolve properly in GitHub markdown previews, etc.
     imageProps.src = (src as string).replace(/^\/public/g, "");
   }
 

package.json

@@ -117,9 +117,9 @@
       "eslint"
     ]
   },
-  "packageManager": "yarn@1.22.18",
+  "packageManager": "yarn@1.22.19",
   "volta": {
     "node": "16.15.1",
-    "yarn": "1.22.18"
+    "yarn": "1.22.19"
   }
 }

yarn.lock

@@ -2596,9 +2596,9 @@ eastasianwidth@^0.2.0:
   integrity sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==
 
 electron-to-chromium@^1.4.147:
-  version "1.4.150"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.150.tgz#89f0e12505462d5df7e56c5b91aff7e1dfdd33ec"
-  integrity sha512-MP3oBer0X7ZeS9GJ0H6lmkn561UxiwOIY9TTkdxVY7lI9G6GVCKfgJaHaDcakwdKxBXA4T3ybeswH/WBIN/KTA==
+  version "1.4.151"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.151.tgz#d1c09dd3a06cb81ef03a3bbbff6905827c33ab4b"
+  integrity sha512-XaG2LpZi9fdiWYOqJh0dJy4SlVywCvpgYXhzOlZTp4JqSKqxn5URqOjbm9OMYB3aInA2GuHQiem1QUOc1yT0Pw==
 
 emoji-regex@^8.0.0:
   version "8.0.0"
@@ -6057,7 +6057,7 @@ tapable@^2.2.0:
 text-table@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
-  integrity sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=
+  integrity sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==
 
 throttle-debounce@^3.0.1:
   version "3.0.1"
@@ -6067,7 +6067,7 @@ throttle-debounce@^3.0.1:
 through@^2.3.8:
   version "2.3.8"
   resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5"
-  integrity sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=
+  integrity sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==
 
 tiny-warning@^1.0.2:
   version "1.0.3"
@@ -6077,7 +6077,7 @@ tiny-warning@^1.0.2:
 to-fast-properties@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e"
-  integrity sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=
+  integrity sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==
 
 to-regex-range@^5.0.1:
   version "5.0.1"
@@ -6089,7 +6089,7 @@ to-regex-range@^5.0.1:
 toggle-selection@^1.0.6:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/toggle-selection/-/toggle-selection-1.0.6.tgz#6e45b1263f2017fa0acc7d89d78b15b8bf77da32"
-  integrity sha1-bkWxJj8gF/oKzH2J14sVuL932jI=
+  integrity sha512-BiZS+C1OS8g/q2RRbJmy59xpyghNBqrr6k5L/uKBGRsTfxmu3ffiRnd8mlGPUVayg8pvfi5urfnu8TU7DVOkLQ==
 
 totalist@^1.0.0:
   version "1.1.0"
@@ -6099,7 +6099,7 @@ totalist@^1.0.0:
 tr46@~0.0.3:
   version "0.0.3"
   resolved "https://registry.yarnpkg.com/tr46/-/tr46-0.0.3.tgz#8184fd347dac9cdc185992f3a6622e14b9d9ab6a"
-  integrity sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o=
+  integrity sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==
 
 trim-trailing-lines@^1.0.0:
   version "1.1.4"