From caa83ad318337302172a1653e98c8008322257a3 Mon Sep 17 00:00:00 2001
From: krek0 <kreko@posteo.net>
Date: Thu, 24 Sep 2026 13:50:18 +0200
Subject: [PATCH] Load gallery thumbnails lazily instead of all at once

---
 photologue/static/gallery_justified.js              | 2 --
 photologue/templates/photologue/gallery_detail.html | 2 +-
 2 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/photologue/static/gallery_justified.js b/photologue/static/gallery_justified.js
index 12ce8f9..c4958c7 100644
--- a/photologue/static/gallery_justified.js
+++ b/photologue/static/gallery_justified.js
@@ -80,8 +80,6 @@
         container.style.height = (top - SPACING + PADDING) + 'px';
         items.forEach(item => {
             item.style.visibility = 'visible';
-            const img = item.querySelector('img[data-lazy]');
-            if (img) img.src = img.dataset.lazy;
         });
     }
 
diff --git a/photologue/templates/photologue/gallery_detail.html b/photologue/templates/photologue/gallery_detail.html
index 086b708..c9a85d6 100755
--- a/photologue/templates/photologue/gallery_detail.html
+++ b/photologue/templates/photologue/gallery_detail.html
@@ -112,7 +112,7 @@ SPDX-License-Identifier: GPL-3.0-or-later
            data-uncensor-url="{% url 'photologue:pl-media-uncensor' item.model_name item.id %}"
            data-width="{{ item.thumbnail_width|default:1 }}"
            data-height="{{ item.thumbnail_height|default:1 }}">
-            <img src="{{ item.get_thumbnail_url }}" data-lazy="{{ item.get_thumbnail_url }}"
+            <img src="{{ item.get_thumbnail_url }}" loading="lazy" decoding="async"
                  class="{% if not item.is_public %}photo-private{% endif %}"
                  alt="{{ item.title }}{% if item.date_taken %} - {{ item.date_taken|date }} {{ item.date_taken|time }}{% endif %} - {{ item.owner.first_name|default:item.owner.username }}{% if not item.is_video and item.license %} - {{ item.license }}{% endif %}{% if not item.is_public %} - !PRIVATE!{% endif %}">
         </a>