[ 언어·프레임워크/Next.js ]
[Next.js] AR 물고기 두마리가 겹쳐 보이는 현상?! useEffect 2번 호출 문제!
2023-10-25 10:41:40
1. AR 물고기 두 마리가 겹쳐 보이는 현상?! Next.js에서 mind-ar 라이브러리를 이용해 웹 AR을 구현하고 있다. 카메라에 Target 이미지가 들어오면 물고기 3D 모델이 렌더링 되도록 하였다. 다행히도 잘 렌더링 되었는데 물고기 상태가 좀 이상하다. 파들 파들 떠는 것 같기도 하고 영화 매트릭스나 사이버펑크에서 봤던 화면 지직 거리는 것 같기도 한 현상이 발생했다. 2. 원인은 useEffect 2회 호출 문제 원인은 useEffect 훅이 2번 호출되는 문제 때문이었다. 일전에 html에서 테스트했던 코드에서는 이런 현상이 없었던 점, react에서 로 설정되어 있는 경우 useEffect가 2회 호출된다는 것을 알고 있었다. 그래서 Next.js에서도 유사한 현상일 거라 생각했고 역..