From cfe47952c0e088e9c3d8436f71dd4ac0d342bac6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bal=C3=A1zs=20Varga?= <warnyul@gmail.com>
Date: Fri, 29 Nov 2024 12:00:23 +0100
Subject: [PATCH] feat: Enable lazy loading for images (#58)

Added `loading="lazy"` attribute to `<img>` tags to improve page performance by deferring offscreen image loading.
---
 src/views/404.ejs   | 2 +-
 src/views/index.ejs | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/404.ejs b/src/views/404.ejs
index c53c95d..a00aab6 100644
--- a/src/views/404.ejs
+++ b/src/views/404.ejs
@@ -16,7 +16,7 @@
         <picture>
             <!-- Source of the image: https://www.cleanpng.com/png-http-404-error-user-interface-design-google-chrome-2045552/ -->
             <source type="image/webp" srcset="../assets/images/confused-robot.png?as=webp">
-            <img src="../assets/images/confused-robot.png" alt="Confused robot looking for the page" width="300" height="270" />
+            <img src="../assets/images/confused-robot.png" alt="Confused robot looking for the page" loading="lazy" width="300" height="270" />
         </picture>
         <div class="action">
             <p>Don't worry, even robots get lost sometimes.</p>
diff --git a/src/views/index.ejs b/src/views/index.ejs
index 4a28a46..3f33dac 100644
--- a/src/views/index.ejs
+++ b/src/views/index.ejs
@@ -43,7 +43,7 @@
             <header>
                 <picture>
                     <source type="image/webp" srcset="../assets/images/profile100w100h.png?as=webp" />
-                    <img class="clazz-profile-image" src="../assets/images/profile100w100h.png" alt="Profile picture of Balázs Varga, CTO @ Apter" width="100" height="100" />
+                    <img class="clazz-profile-image" src="../assets/images/profile100w100h.png" alt="Profile picture of Balázs Varga, CTO @ Apter" loading="lazy" width="100" height="100" />
                 </picture>
                 <h1 class="clazz-text-center">Balázs Varga</h1>
             </header>