Cộng đồng Hỏi & Đáp của Inflearn

oridori2705

câu hỏi đã được viết

[Làm mới] Tạo ứng dụng bản đồ nhà hàng ngon (React Native & NestJS)

[B-0] Phân cụm marker (Nhóm marker)

안드로이드 실행 중 Drawer네비게이션과 MapView 성능 문제

Viết

서랍 네비게이션을 열 때마다 뒤에 MapView가 마운트 언마운트 되는 문제

아래 링크 영상처럼 서랍 네비게이션을 열 때마다 뒤에 MapView가 언마운트 마운트가 되면서 성능 관련 문제가 생기는 것 같습니다. 이게 애뮬레이터 문제인지 제 컴퓨터 문제인지, 강의에서는 이런 문제가 안보이는데..

해당 문제 해결할 방법이 혹시 있을까요?
네비게이션을 열 때마다 렉이 걸려서 자꾸 애플리케이션이 다운됩니다 ㅠㅠ
방법을 찾아보고 메모이제이션도 해보고, Drawer 옵션도 사용해봤는데 무용지물이네요 ㅠ

https://drive.google.com/file/d/1tM8iR9QgukKVd_I5zfk6GhbKneLE1DkZ/view?usp=drive_link

react-nativetypescriptnestjsreact-queryzustand

Quiz

지도에 마커가 매우 많을 때, 화면의 가독성을 높이고 겹침 문제를 해결하기 위해 주로 어떤 기법을 사용하나요?

마커 투명도 조절

마커 클러스터링 (그룹화)

지도 배경 색상 변경

마커 아이콘 크기 일괄 축소

Câu trả lời 2

Kyo

Người chia sẻ kiến thức

이거 저도 80버전에서 겪었던 이슈인데요,
1) rn이 79.4 버전이라면 navigation 버전을 저와같이 맞추시거나,

"@react-navigation/drawer": "^7.5.2",

"@react-navigation/native": "^7.1.14",

"@react-navigation/stack": "^7.4.2",

2) 현재 네비게이션 버전을 latest로 하셨다면 react native 버전도 latest로 진행해보시는 방법

두가지 시도해보시면 좋을것 같습니다!

Kyo

Người chia sẻ kiến thức

버전알려주시고, 파일을 제가볼수없는데 엑세스허용해주시겠어요?

oridori2705

Người đặt câu hỏi

아 넵 권한 허용했습니다! 버전은 아래처럼 올리면 될까요?

{
  "name": "AwesomeProject",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "lint": "eslint .",
    "start": "react-native start",
    "test": "jest",
    "postinstall": "patch-package"
  },
  "dependencies": {
    "@invertase/react-native-apple-authentication": "^2.5.0",
    "@react-native-community/geolocation": "^3.4.0",
    "@react-native-masked-view/masked-view": "^0.3.2",
    "@react-native-vector-icons/fontawesome6": "^12.2.0",
    "@react-native-vector-icons/ionicons": "^12.3.0",
    "@react-navigation/drawer": "^7.7.1",
    "@react-navigation/native": "^7.1.19",
    "@react-navigation/stack": "^7.6.0",
    "@tanstack/react-query": "^5.90.5",
    "axios": "^1.13.1",
    "patch-package": "^8.0.1",
    "react": "19.0.0",
    "react-error-boundary": "^6.0.0",
    "react-native": "0.79.4",
    "react-native-bootsplash": "^6.3.11",
    "react-native-config": "^1.5.5",
    "react-native-date-picker": "^5.0.12",
    "react-native-encrypted-storage": "^4.0.3",
    "react-native-fast-image": "^8.6.3",
    "react-native-gesture-handler": "^2.29.0",
    "react-native-image-crop-picker": "^0.50.1",
    "react-native-map-clustering": "^4.0.0",
    "react-native-maps": "^1.26.0",
    "react-native-permissions": "^5.4.4",
    "react-native-reanimated": "^4.1.3",
    "react-native-safe-area-context": "^5.6.1",
    "react-native-screens": "^4.18.0",
    "react-native-toast-message": "^2.3.3",
    "react-native-webview": "^13.16.0",
    "react-native-worklets": "^0.5.2",
    "zustand": "^5.0.8"
  },
  "devDependencies": {
    "@babel/core": "^7.25.2",
    "@babel/preset-env": "^7.25.3",
    "@babel/runtime": "^7.25.0",
    "@react-native-community/cli": "18.0.0",
    "@react-native-community/cli-platform-android": "18.0.0",
    "@react-native-community/cli-platform-ios": "18.0.0",
    "@react-native/babel-preset": "0.79.4",
    "@react-native/eslint-config": "0.79.4",
    "@react-native/metro-config": "0.79.4",
    "@react-native/typescript-config": "0.79.4",
    "@types/jest": "^29.5.13",
    "@types/react": "^19.0.0",
    "@types/react-test-renderer": "^19.0.0",
    "babel-plugin-module-resolver": "^5.0.2",
    "eslint": "^8.19.0",
    "jest": "^29.6.3",
    "prettier": "2.8.8",
    "react-test-renderer": "19.0.0",
    "typescript": "5.0.4"
  },
  "engines": {
    "node": ">=18"
  }
}

oridori2705

câu hỏi đã được viết

Đặt câu hỏi