perf: reduce image sizes to stay under 100KB threshold

This commit is contained in:
Lorenzo Iovino 2026-01-08 18:04:23 +01:00
parent 049c20a4b2
commit 7ba4560631
6 changed files with 26 additions and 19 deletions

View file

@ -131,7 +131,7 @@ At some point I decided to go back to Sicily.
Not as a “I give up” move. More like: I want a different balance.
<div class="float-left img-medium">
<Image src={remote} alt="Working remote watching the sea" class="float-left img-medium" width={400} height={300} quality={80} format="webp" />
<Image src={remote} alt="Working remote watching the sea" class="float-left img-medium" width={300} height={225} quality={75} format="webp" />
<em class="text-sm block mt-2">Working remote watching the sea</em>
</div>
@ -142,7 +142,7 @@ I work remote, and Sicily is perfect for that. Life is slower. Sometimes its
Time here feels different. You can actually breathe. You can have “nothing special” days, and those days can still feel good.
<div class="w-full">
<Image src={dogs} alt="My wineyard" class="img-hero" width={1200} height={630} quality={80} format="webp" />
<Image src={dogs} alt="My wineyard" class="img-hero" width={800} height={420} quality={70} format="webp" />
<em class="text-sm block mt-2">My wineyard</em>
</div>
@ -162,7 +162,7 @@ And yes: food. Sicily is crazy for food. Its not even a “food culture”, i
For me, living here is a reminder: success is not only about projects and code. Its also about how you live your days.
<div class="w-full">
<Image src={modica} alt="Modica view from my house" class="img-hero" width={1200} height={630} quality={80} format="webp" />
<Image src={modica} alt="Modica view from my house" class="img-hero" width={1200} height={630} quality={70} format="webp" />
<em class="text-sm block mt-2">Modica view from my house</em>
</div>
@ -173,6 +173,6 @@ Today Im a husband (to my wife Amanda) and a dad (to our little Leonardo).
Life changed a lot, in a good way. I still love technology, I still build things, but family gives a different meaning to everything.
<div class="w-full">
<Image src={meAmanda} alt="Me and my wife Amanda" class="img-hero" width={1200} height={630} quality={85} format="webp" />
<Image src={meAmanda} alt="Me and my wife Amanda" class="img-hero" width={1200} height={630} quality={65} format="webp" />
<em class="text-sm block mt-2">Me and my wife Amanda</em>
</div>