[맛등산 팀] 프론트엔드 코드리뷰용 Issue

[caseBread]

[맛등산팀] SEMOSAN 프론트엔드 코드리뷰

📌 프로젝트 간략 소개

홈 화면 디자인	소개
	세모산은 등산 과정의 막막함을 해소하고 완등의 성취감을 극대화하는 등린이 맞춤형 가이드 앱 입니다. gps 시각화와 페이스 조절 가이드를 통해 등반 현황을 쉽게 측정할 수 있고, AI 인증 포즈 추천 및 산 정복 아카이빙 기능을 통해 등산을 하나의 즐거운 놀이이자 기록의 자산으로 전환하며 쉽고 재미있게 즐길 수 있도록 합니다.

질문

1. 화면 별 네이티브 혹은 웹뷰 구현 결정 기준

현재 React Native + Expo 환경에서 앱을 개발 중인데, 일부 화면을 seo에도 뿌리기위해 웹으로도 제공해야 하는 상황입니다.

이때 아키텍처를 두 가지 방향으로 고민하고 있습니다:

i. 웹뷰(WebView) 기반으로 통합 구현

• 장점: 코드 재사용 가능
• 단점: 플랫폼별(native or web) 분기 처리 및 복잡도 증가 우려

ii. 네이티브와 웹을 분리하여 각각 구현

• 장점: 구조 단순, 플랫폼 최적화 가능
• 단점: 개발 리소스 증가 (다만 AI 활용으로 어느 정도 상쇄 가능할 것으로 예상)

이 상황에서, 어떤 접근이 더 적절할지 멘토님의 의견이 궁금합니다.
또한, 실제 현업에서는 어떤 기준으로 이런 선택을 하시는지도 알고 싶습니다.

2. Zustand로 GPS 실시간 데이터 관리 시 리렌더링 최적화 방법

GPS처럼 자주 변경되는 실시간 위치 데이터를 Zustand 전역 상태로 관리할 경우 불필요한 리렌더링이나 성능 저하가 발생 할 수도 있는데,
실무에서는 이런 데이터를 어떤 방식으로 관리하시는지 궁금합니다.

3. 필터링 및 대량 데이터 최적화 관련

산 목록 페이지에서 지역, 난이도, 시간 등 다중 필터와 정렬 기능을 구현해야 합니다. 데이터 양이 많아질 경우 클라이언트 단에서 필터링을 처리하는 것과 서버에서 API 쿼리로 처리하는 것 중 실무에서는 어떤 기준(데이터 개수 등)으로 결정하시는지 궁금합니다. 또한, 필터 변경 시마다 발생하는 리렌더링 최적화 팁이 있을까요?

산 목록 페이지 와이어프레임

4. UX 및 성능 최적화 관련

필터링 조건을 선택하거나 검색어를 입력할 때, 실시간으로 결과를 반영하면서도 성능 부하를 줄이기 위해 Debounce나 Throttle을 적용하려 합니다. 멘토님은 보통 검색어 입력 외에도 UI 슬라이더(소요 시간 등)나 다중 선택 필터에도 이를 적극적으로 활용하시는지, 혹은 다른 최적화 기법을 선호하시는지 궁금합니다.

---

바쁘신 와중에 시간 내어 리뷰해 주셔서 감사합니다.
편하게 피드백 부탁드립니다! 🥹