전송 최적화: nginx gzip·이미지 lazy-load·캐시 연장

- nginx 텍스트 자산 gzip 압축 추가로 css/js/json/HTML 전송량 절감
- cardList 카드 이미지 lazy-load로 시리즈 진입 시 즉시 다운로드 방지
- 정적 이미지 캐시 7일→30일 연장
- 미사용 style/deck-history.css 삭제

Co-authored-by: Cursor <cursoragent@cursor.com>

docs/changelog.md

@@ -1,5 +1,11 @@
 # 변경사항
 
+## v4.0.20
+
+### 페이지 로딩 속도 개선
+
+카드 데이터와 스타일 등 텍스트 자원을 압축 전송하도록 개선해 페이지가 더 빠르게 열립니다. 카드 목록 화면은 화면에 보이는 카드부터 순차적으로 이미지를 불러오도록 바뀌어, 시리즈를 처음 열 때 대기 시간이 줄어듭니다. 자주 보는 이미지의 캐시 유지 기간도 늘려 재방문 시 더 빠릅니다.
+
 ## v4.0.19
 
 ### 덱 목록 무한 스크롤

docs/history.md

@@ -1,5 +1,10 @@
 # 의사결정 이력
 
+## 2026-07-03 v4.0.20 — 원본 이미지 변환 전 저비용 전송 최적화부터 적용
+
+💡 1.8GB PNG의 WebP 일괄 변환은 파이프라인 부담이 커, 리스크가 낮고 효과가 큰 gzip·lazy-load·캐시부터 선적용하기 위함.
+🔧 nginx gzip(텍스트 한정) + `cardList` 이미지 lazy-load + 이미지 캐시 30d로 연장, 원본 WebP 변환은 후속 과제로 분리.
+
 ## 2026-07-02 v4.0.19 — 덱 목록은 무한 스크롤 + WebP 썸네일 이원화
 
 💡 페이지네이션 대신 무한 스크롤로 초기 DOM 부담을 줄이되, 원본 1200px PNG를 목록마다 내려받는 대역폭 낭비를 없애기 위함.

docs/spec.md

@@ -3,7 +3,7 @@
 ## 프로젝트 개요
 
 - 서비스명: `UNIARE - Union Arena Deck Builder`
-- 현재 버전: `v4.0.19`
+- 현재 버전: `v4.0.20`
 - 프론트: 정적 HTML, CSS, JavaScript
 - 백엔드: Express, SQLite(`better-sqlite3`)
 - 운영: Docker Compose 기반 Nginx + API
@@ -77,6 +77,8 @@
 - 내 덱·공개 덱 목록은 클라이언트 무한 스크롤(청크 24개)로 렌더링한다.
 - 덱 삭제·미참조 정리 시 해당 공유 코드의 원본 PNG와 썸네일 WebP를 함께 삭제한다.
 - 관리자는 DB에서 참조하지 않는 미리보기 파일을 조회하고 일괄 삭제할 수 있다.
+- nginx는 텍스트 자산(css/js/json/svg 등)을 gzip으로 압축 전송하고, 정적 이미지는 30일 immutable 캐시로 제공한다.
+- 카드 목록 화면의 카드 이미지는 `loading="lazy"`로 지연 로드한다.
 
 ## 브라우저 상태
 

docs/todo.md

@@ -18,6 +18,8 @@
 
 ## 유지보수
 
+- 카드 원본 이미지(약 1.8GB PNG)를 WebP로 일괄 변환하고 참조 경로·폴백을 정비해 대역폭을 절감한다.
+- 유난히 큰 개별 이미지(예: `ua44/…EVA-1-079_p2.png` 1.2MB, `ua14/UAPR_DST-1-039.png` 1.0MB, `logo_unionarena.png` 431KB)를 재압축한다.
 - `cardList.html`, `result.html`의 대형 인라인 스크립트를 기능 단위 모듈로 분리한다.
 - `datas/ua99 sample.js`, `datas/ua99 sample mini.js`의 보존 목적과 배포 제외 여부를 확정한다.
 

docs/update.md

@@ -1,5 +1,17 @@
 # 업데이트 이력
 
+## 2026-07-03 / v4.0.20 — 전송 최적화(gzip·lazy-load·캐시)
+
+### 수행 작업
+- nginx에 텍스트 자산 gzip 압축 추가(css/js/json/svg 등, `gzip_min_length 1024`, `comp_level 6`) — output.css·카드 데이터·HTML 전송량 약 70~80% 절감
+- `cardList.html` 카드 그리드 이미지에 `loading="lazy" decoding="async"` 추가 — 시리즈 진입 시 전체(~90장) 즉시 다운로드 방지
+- 정적 이미지 캐시 기간 `expires 7d → 30d`로 연장(내용 고정, immutable 유지)
+- 미사용 `style/deck-history.css`(10.8KB) 삭제 (현재 어떤 화면도 참조하지 않음)
+
+### 검증
+- nginx 설정은 문법상 표준 디렉티브만 사용(배포 시 `nginx -t` 권장)
+- `deck-history.css` 참조가 HTML/CSS/Dockerfile에 없음을 확인 후 삭제
+
 ## 2026-07-02 / v4.0.19 — 덱 목록 무한 스크롤·WebP 썸네일
 
 ### 수행 작업