✨ Feat: 리스트 페이지 무한 스크롤 기능 추가 및 useInfiniteScroll 훅 롤백#144
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Summary of ChangesHello @aahreum, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! 이 PR은 리스트 페이지에 모바일 환경을 위한 가로 무한 스크롤 기능을 도입하여 사용자 경험을 향상시키는 것을 목표로 합니다. 이를 위해 리스트 컴포넌트 구조를 데스크톱과 모바일로 분리하고, 데이터 로딩 로직을 담당하는 Highlights
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
|
🎉 구현한 기능 Preview: https://frontend-exz47tc31-fe-19-seongihuns-projects.vercel.app |
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
src/hooks/useRollingPaperData.js
Outdated
| const merged = [...prev.results, ...result.results]; | ||
| const unique = merged.filter( | ||
| (item, idx, arr) => idx === arr.findIndex((t) => t.id === item.id) | ||
| ); | ||
| return { ...result, results: unique }; |
There was a problem hiding this comment.
데이터를 추가로 불러올 때 중복을 제거하는 로직이 현재 O(n^2)의 시간 복잡도를 가집니다. 리스트가 길어질수록 성능 저하가 발생할 수 있습니다. 또한, findIndex는 첫 번째 요소의 인덱스를 반환하므로, 만약 서버에서 데이터가 업데이트되어 동일한 ID의 아이템이 다시 수신될 경우 이전 데이터가 유지되고 새로운 데이터가 버려질 수 있습니다.
Map을 사용하여 O(n) 시간 복잡도로 중복을 제거하고 항상 최신 데이터를 유지하도록 개선하는 것을 제안합니다.
const uniqueById = new Map();
[...prev.results, ...result.results].forEach(item => {
uniqueById.set(item.id, item);
});
const unique = Array.from(uniqueById.values());
return { ...result, results: unique };
src/hooks/useRollingPaperData.js
Outdated
| * @param {'desktop' | 'mobile'} [mode='desktop'] - 데이터 로드 모드 | ||
| * @returns {{ | ||
| * data: Object | null, | ||
| * data: Object[] | null, |
There was a problem hiding this comment.
JSDoc에서 data의 반환 타입을 Object[] | null로 정의하셨는데, 실제로는 API 응답 전체 객체({ count, next, previous, results })가 반환되므로 Object | null이 더 정확한 타입입니다. 문서의 명확성을 위해 수정하는 것이 좋겠습니다.
| * data: Object[] | null, | |
| * data: Object | null, |
|
🎉 구현한 기능 Preview: https://frontend-nx6tg1s1c-fe-19-seongihuns-projects.vercel.app |
2 participants
🔗 이슈 번호
✨ 작업한 내용
💁 Review Point