fix(web): explore browse 카드에 이미지 치수 배선 + 데드 상태 정리 (#814)#827
Merged
Conversation
browse 모드 posts DTO의 image_width/image_height를 explore 카드까지 배선. useInfinitePosts→PostGridItem엔 이미 있었으나 GridItem→ExploreCardCell→PostImage 경로에서 끊겨 있던 것을 연결. - GridItem 타입에 imageWidth/imageHeight 추가(ThiingsGrid). - ExploreClient gridItems 매핑에서 치수 passthrough(값 있을 때만). - ExploreCardCell → PostImage에 imageWidth/imageHeight 전달(800x1000 매직넘버 대체). - ExploreCardCell의 데드 isLoaded 상태 제거(set만 되고 read 안 되던 cruft). **사용자 체감 변화 없음**: (1) 현 explore는 리디자인(#742) 후 고정 aspect-[3/4] 셀이라 grid CLS 없음(원 티켓 CLS 전제는 pre-redesign), (2) loader가 외부 URL 옵티마이저를 우회해 치수로 srcset이 안 바뀜, (3) object-contain은 실제 픽셀로 크기를 잡아 육안 차 미미. 이 PR의 실제 가치 = **enabler**: 변환 경로 복귀(#819) 시 올바른 srcset 선택을 가능케 하는 배선 + 데드 코드 삭제. search 모드(SearchResultItem)는 치수 미노출 → backend graduate. 검증: tsc·lint(내 파일 0 err)·vitest 701/701. 치수 흐름 회귀 테스트 추가. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Resolves #814 · Part of #810 (이미지 로드/웹 최적화 wayfinder 맵)
무엇을
browse 모드 posts DTO의
image_width/image_height를 explore 카드까지 배선하고, ExploreCardCell의 데드isLoaded상태를 제거합니다.이 PR은 지금 관찰 가능한 개선을 주지 않습니다:
aspect-[3/4]셀(ExploreClient.tsx:477)이라 grid-level CLS가 이미 없음. img 박스도 render 시점에 width/height attr로 확정되어 로드 시 시프트 없음. explore 카드 치수 전달 + 스켈레톤 onLoad 싱크 #814 원 티켓의 "레이아웃 시프트" 전제는 pre-redesign(가변 높이) 기준.object-contain이 실제 픽셀로 크기를 잡아 correct-vs-wrong attr 차이가 거의 안 보임(안 보이는 element-box 높이·블러 경계만 변함).실제 가치 = enabler: 변환 경로 복귀(#819)로 옵티마이저가 다시 켜지면 올바른 dims → 올바른 srcset 선택이 가능해짐. 지금은 그 배선을 미리 깔고 데드 코드를 지우는 것. #819를 de-risk.
변경
GridItem타입에imageWidth/imageHeight추가 (ThiingsGrid).ExploreClientgridItems매핑에서 치수 passthrough(값 있을 때만).ExploreCardCell→PostImage에imageWidth/imageHeight전달 (800x1000 매직넘버 fallback 대체).ExploreCardCell의 데드isLoaded상태 제거 (set만 되고 read 안 되던 cruft).범위 밖 / graduate
SearchResultItem(Meilisearch)에 치수 필드가 없어 검색 카드는 800x1000 fallback 유지 → 백엔드에 dims 추가 필요(맵 fog, philippe 조율).검증
ExploreCardCell.test.tsx): 치수 있음 → img1200x800, 없음 →800x1000fallback.bunx tsc --noEmitclean · 변경 파일eslint0 error ·vitest run701/701 통과.🤖 Generated with Claude Code