모바일 환경에서 갤러리 페이지에서의 스크롤이 부자연스럽게 이뤄지는 버그 수정

src/lib/components/atoms/RowVirtualizer.svelte

@@ -34,27 +34,30 @@
     if (!element) return;
 
     const observer = new ResizeObserver(() => {
-      scrollMargin = element!.getBoundingClientRect().top + window.scrollY;
+      scrollMargin = Math.round(element!.getBoundingClientRect().top + window.scrollY);
     });
     observer.observe(element.parentElement!);
     return () => observer.disconnect();
   });
 </script>
 
-<div bind:this={element} class={["relative", className]}>
+<div
-  <div style:height="{$virtualizer.getTotalSize()}px">
+  bind:this={element}
-    {#each $virtualizer.getVirtualItems() as virtualItem (virtualItem.key)}
+  class={["relative", className]}
-      <div
+  style:height="{$virtualizer.getTotalSize()}px"
-        class="absolute left-0 top-0 w-full"
+>
-        style:transform="translateY({virtualItem.start - scrollMargin}px)"
+  {#each $virtualizer.getVirtualItems() as virtualItem (virtualItem.key)}
-        data-index={virtualItem.index}
+    <div
-        use:measureItem
+      class="absolute left-0 top-0 w-full"
-      >
+      style:transform="translateY({virtualItem.start - scrollMargin}px)"
-        {@render item(virtualItem.index)}
+      data-index={virtualItem.index}
-      </div>
+      use:measureItem
-    {/each}
+    >
-  </div>
+      {@render item(virtualItem.index)}
-  {#if placeholder && $virtualizer.getVirtualItems().length === 0}
+    </div>
-    {@render placeholder()}
+  {/each}
-  {/if}
 </div>
+
+{#if placeholder && $virtualizer.getVirtualItems().length === 0}
+  {@render placeholder()}
+{/if}

src/lib/components/organisms/Gallery.svelte

@@ -49,11 +49,7 @@
 <RowVirtualizer
   count={rows.length}
   itemHeight={(index) =>
-    rows[index]!.type === "header"
+    rows[index]!.type === "header" ? 28 : 181 + (rows[index]!.isLast ? 16 : 4)}
-      ? 28
-      : Math.ceil(rows[index]!.files.length / 4) * 181 +
-        (Math.ceil(rows[index]!.files.length / 4) - 1) * 4 +
-        16}
   class="flex flex-grow flex-col"
 >
   {#snippet item(index)}