Skip to content

[중복] feat: virtual scroll 기능 구현#88

Merged
howyoujini merged 0 commit intodevfrom
virtualScroll
Nov 18, 2024
Merged

[중복] feat: virtual scroll 기능 구현#88
howyoujini merged 0 commit intodevfrom
virtualScroll

Conversation

@howyoujini
Copy link
Contributor

@howyoujini howyoujini commented Nov 18, 2024

이슈

🔗 이슈 링크 #68
#93
해당 PR 은 중복되었으므로, 위 링크에서 PR 을 참고해주세요!

요약

  • 이미 전체 데이터를 알고 있는 상태에서, 가상스크롤을 구현하여 퍼포먼스를 최적화했습니다.

작업내용

  • useWindowSize 훅을 구현했습니다.
  • useWindowScroll 훅을 구현했습니다.
  • VirtualScroll 공용 컴포넌트를 구현했습니다.

참고사항

  • virtualScroll 브랜치로 이동하여, 잘 동작하는지 확인부탁드립니다 !

PR 체크 사항

주의 사항

  • PR 크기는 300~500줄로 하되 최대 1000줄 미만으로 합니다.
  • conflict를 모두 해결하고 PR을 올려주세요.

PR 전 체크리스트

  • 가장 최신 브랜치를 pull 하였습니다.
  • virtualScroll 브랜치명을 확인하였습니다.
  • 코드 컨벤션을 모두 확인하였습니다.
  • 브랜치명을 확인하였습니다.

리뷰 반영사항

  • [ ]

@howyoujini howyoujini added the feat New feature or request label Nov 18, 2024
@howyoujini howyoujini added this to the 화면 목록 작업 milestone Nov 18, 2024
@howyoujini howyoujini self-assigned this Nov 18, 2024
@howyoujini howyoujini linked an issue Nov 18, 2024 that may be closed by this pull request
2 tasks
Comment on lines +9 to +22
useEffect(() => {
const handleResize = () => {
setWindowSize({
width: window.innerWidth,
height: window.innerHeight,
});
};

window.addEventListener("resize", handleResize);

return () => {
window.removeEventListener("resize", handleResize);
};
}, []);
Copy link
Contributor

@GreenteaHT GreenteaHT Nov 18, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

스크롤 이벤트는 엄청나게 발생하니 throttling을 이용해서 제한을 주는 건 어떨까요? 그리고 height에 대한 변화를 조건문으로 두어서 width에 대한 setter도 과감하게 빼버리는게 성능개선에 도움이 될 것 같아요!

@howyoujini howyoujini merged commit 2f3a0db into dev Nov 18, 2024
@howyoujini howyoujini removed the feat New feature or request label Nov 19, 2024
@howyoujini howyoujini changed the title feat: virtual scroll 기능 구현 [중복] feat: virtual scroll 기능 구현 Nov 19, 2024
@howyoujini howyoujini added the wontfix This will not be worked on label Nov 20, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

wontfix This will not be worked on

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

디테일 페이지에 Virtual Scroll 적용

2 participants