x

src/pages/gallery.astro

@@ -318,7 +318,7 @@ import { Icon } from "astro-icon/components";
     if (sentinel) observer.observe(sentinel);
   }
 
-  function createCard(imageData, index) {
+  function createCard(imageData, index, isInitial = false) {
     const { url, year, month } = imageData;
     const div = document.createElement('div');
     div.className = 'gallery-item relative rounded-lg overflow-hidden cursor-zoom-in group/img bg-black/5 dark:bg-white/5';
@@ -332,7 +332,7 @@ import { Icon } from "astro-icon/components";
       </div>
       <img
         src="${url}"
-        loading="lazy"
+        ${isInitial ? '' : 'loading="lazy"'}
         class="w-full h-auto object-cover opacity-0 transition-all duration-500 group-hover/img:scale-105 group-hover/img:opacity-90"
         alt="Gallery Image"
       />
@@ -384,10 +384,11 @@ import { Icon } from "astro-icon/components";
     }
 
     const end = Math.min(currentIndex + BATCH_SIZE, filteredImages.length);
+    const isInitialBatch = currentIndex === 0;
 
     for (let i = currentIndex; i < end; i++) {
       const imageData = filteredImages[i];
-      const card = createCard(imageData, i);
+      const card = createCard(imageData, i, isInitialBatch);
 
       // 使用高度平衡算法分配到最短的列
       const colIndex = getShortestColumn();