From b0803fa28d744558e511f52798611acb39785e82 Mon Sep 17 00:00:00 2001
From: Zamitto <167933696+zamitto@users.noreply.github.com>
Date: Sun, 12 May 2024 16:51:25 -0300
Subject: [PATCH] feat: add lazy loading to images and thumbs

---
 src/renderer/src/pages/game-details/gallery-slider.tsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/renderer/src/pages/game-details/gallery-slider.tsx b/src/renderer/src/pages/game-details/gallery-slider.tsx
index 287b83cb..174c4759 100644
--- a/src/renderer/src/pages/game-details/gallery-slider.tsx
+++ b/src/renderer/src/pages/game-details/gallery-slider.tsx
@@ -112,6 +112,7 @@ export function GallerySlider({ gameDetails }: GallerySliderProps) {
                 (image: SteamScreenshot, i: number) => (
                   <img
                     key={"image-" + i}
+                    loading="lazy"
                     className={styles.gallerySliderMedia}
                     src={image.path_full}
                     style={{ translate: `${-100 * mediaIndex}%` }}
@@ -146,6 +147,7 @@ export function GallerySlider({ gameDetails }: GallerySliderProps) {
               gameDetails.movies?.map((video: SteamMovies, i: number) => (
                 <img
                   key={video.id}
+                  loading="lazy"
                   onClick={() => setMediaIndex(i)}
                   src={video.thumbnail}
                   className={`${styles.gallerySliderMediaPreview} ${mediaIndex === i ? styles.gallerySliderMediaPreviewActive : ""}`}
@@ -156,6 +158,7 @@ export function GallerySlider({ gameDetails }: GallerySliderProps) {
                 (image: SteamScreenshot, i: number) => (
                   <img
                     key={"image-thumb-" + i}
+                    loading="lazy"
                     onClick={() =>
                       setMediaIndex(
                         i + (gameDetails.movies ? gameDetails.movies.length : 0)