Repository navigation
TodayPick v1.13.2
피드 화면이 그려지는 속도를 개선했습니다. 첫 페이지 카드를 서버에서 미리 그려 보내고, 첫 줄 썸네일을 바로 받습니다. Production Lighthouse에서 모바일 LCP가 7.6초에서 3.9초로, 데스크톱 LCP가 2.1초에서 1.3초로 줄었습니다.
주요 변경 사항
첫 페이지를 서버에서 미리 그리기
- 피드 화면과 홈 "오늘 읽어볼 콘텐츠"의 카드가 페이지와 함께 도착해 로딩 스켈레톤 없이 보입니다.
- 다음 페이지, 탭을 바꾼 뒤 목록, 검색은 지금처럼 브라우저에서 요청합니다.
- 서버 조회가 실패하면 브라우저에서 다시 조회합니다.
첫 줄 썸네일 바로 받기
- 데스크톱 첫 줄(앞 3장) 카드 이미지는 지연 로딩하지 않습니다. 우선순위 힌트는 첫 장에만 둡니다.
- 첫 화면 이미지는 받기 전부터 자리에 보이게 둡니다. 이전에는 이미지를 받은 뒤 JS가 투명도를 풀어야 보였습니다.
개선 사항
- 피드 조회 로직(관심 분야 정렬, 스크랩 상태)을 서버 함수로 분리해 API와 페이지가 함께 씁니다.
버그 수정
- 없음
데이터베이스 및 운영 반영
- 없음
/와/feeds는 요청마다 서버에서 렌더링됩니다.
검증
- lint, type-check, test 590개, production build 통과
- 이슈 PR과 릴리스 PR의
CI / verify, Vercel 검사 통과 - Production HTML에 첫 페이지 카드 12개가 들어 있고, 1장 우선 로딩·2~3장 즉시 로딩·4장부터 지연 로딩임을 확인
- Production Lighthouse(테크 블로그, 각 3회 중앙값)
| v1.13.1 | v1.13.2 | |
|---|---|---|
| 모바일 점수 / LCP | 76 / 7.6초 | 88 / 3.9초 |
| 데스크톱 점수 / LCP | 90 / 2.1초 | 97 / 1.3초 |
알려진 제한 사항
- 페이지 첫 바이트(TTFB)가 서버 조회만큼 늘었습니다(약 0.21초).
- 모바일에서는 화면 밖인 2~3장 이미지도 지연 로딩하지 않습니다.
- 측정 기록: performance/2026-10-14-feed-ssr.md