diff --git a/src/features/tech-log/presentation/shared/public-render/asset-resolvers.ts b/src/features/tech-log/presentation/shared/public-render/asset-resolvers.ts
index a2a7541..54ee03f 100644
--- a/src/features/tech-log/presentation/shared/public-render/asset-resolvers.ts
+++ b/src/features/tech-log/presentation/shared/public-render/asset-resolvers.ts
@@ -53,8 +53,12 @@ export type ResolvedAssetLike = Readonly<{
function fromDescriptor(descriptor: ResolvedAssetLike): EvidenceAsset {
return Object.freeze({
src: descriptor.publicPath,
- width: descriptor.width ?? 1,
- height: descriptor.height ?? 1,
+ // 치수를 모르면 0 으로 둔다 — 1 이 아니라. 1×1 은 "아주 작은 그림" 이라는 거짓말이고,
+ // `loading="lazy"` 와 만나면 브라우저는 화면에 걸리지 않는 1×1 상자를 영영 가져오지 않는다.
+ // 실제로 업로드가 치수를 기록하지 않아 모든 그림이 그렇게 사라졌다. 0 은 figure 가
+ // 자기 값을 모른다는 뜻이고, 렌더러가 그때 속성을 빼고 즉시 로드로 바꾼다.
+ width: descriptor.width ?? 0,
+ height: descriptor.height ?? 0,
triggerLabel: `${descriptor.assetKey} 이미지 크게 보기`,
dialogLabel: `${descriptor.assetKey} 확대`,
});
diff --git a/src/features/tech-log/presentation/shared/public-render/evidence-figure.tsx b/src/features/tech-log/presentation/shared/public-render/evidence-figure.tsx
index 47b188e..a9b7c39 100644
--- a/src/features/tech-log/presentation/shared/public-render/evidence-figure.tsx
+++ b/src/features/tech-log/presentation/shared/public-render/evidence-figure.tsx
@@ -30,16 +30,20 @@ export function PublicEvidenceFigure({
dialogRef.current?.close();
}
+ /**
+ * 치수를 아는 그림만 자리를 미리 잡는다. 모르는데 숫자를 적으면 그 상자가 진짜 크기가 되고,
+ * `loading="lazy"` 는 화면에 걸리지 않는 상자를 끝내 가져오지 않는다 — 그림이 통째로 사라진다.
+ * 모를 때는 속성을 빼고 즉시 로드해, 브라우저가 원래 크기로 그리게 둔다.
+ */
+ const known = asset.width > 0 && asset.height > 0;
+ const sizing = known
+ ? ({ width: asset.width, height: asset.height, loading: "lazy" } as const)
+ : ({ loading: "eager" } as const);
+
if (!zoom) {
return (
-
+ {caption}
);
@@ -56,13 +60,7 @@ export function PublicEvidenceFigure({
aria-describedby={descriptionId}
onClick={open}
>
-
+ 크게 보기
{alt}
@@ -84,13 +82,7 @@ export function PublicEvidenceFigure({
-
+