From 5c698a046326180e1d74da2e2b1022c23b1ff09b Mon Sep 17 00:00:00 2001
From: "Calvin A. Allen" <calvin@codingwithcalvin.net>
Date: Thu, 29 Jan 2026 09:48:00 -0500
Subject: [PATCH] perf(images): use webp format and 80% quality for embedded
 images

Optimizes displayed images while originals remain at full quality for
lightbox viewing.
---
 src/components/PostCard.astro | 4 ++--
 src/layouts/PostLayout.astro  | 2 ++
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/PostCard.astro b/src/components/PostCard.astro
index 9b13018..e9df48a 100644
--- a/src/components/PostCard.astro
+++ b/src/components/PostCard.astro
@@ -30,8 +30,8 @@ const formattedDate = date.toLocaleDateString('en-US', {
         alt={title}
         width={1920}
         height={1080}
-        quality={100}
-        format="png"
+        quality={80}
+        format="webp"
         class="w-full h-full object-cover hover:scale-105 transition-transform duration-300"
         loading="lazy"
       />
diff --git a/src/layouts/PostLayout.astro b/src/layouts/PostLayout.astro
index 5ceb1ba..d4ead42 100644
--- a/src/layouts/PostLayout.astro
+++ b/src/layouts/PostLayout.astro
@@ -58,6 +58,8 @@ const ogImageUrl = image?.src;
           <Image
             src={image}
             alt={title}
+            quality={80}
+            format="webp"
             class="w-full"
           />
         </div>