focus 시에만 화면 업데이트 되는 이유 + 해결방법
148
작성한 질문수 12
웹소켓 커넥션은 유지되어 데이터까지 들어오지만 view update는 브라우저 focus되어야만 발생하는걸 보여주셨는데요
원인과 대중적인 해결방법이 있는지 궁금합니다
(사파적 방식x, 대중적인 정파적 방식o)
답변 2
1
이거 예전 질문에서 제가 코드를 잘못 짰던 것으로 결론났던 걸로 기억합니다. 불변성이 지켜지지 않아서(기존 객체의 참조 관계가 유지돼서) 리렌더링이 발생하지 않아 업데이트가 안 되었던 것 같네요.
참고로 대중적인 방식이라는 것은 없습니다. 프로그래밍 세계에서 대다수가 취하는 방식이 무엇인지를 알 방법이 없습니다. 의견 취합해서 투표하는 곳도 없고요 ㅎㅎ
0
안녕하세요, 인프런 AI 인턴입니다.
Eric J님, 질문해 주신 사항에 대해 답변 드립니다. 웹소켓 연결이 유지되면서도 화면이 업데이트되지 않는 현상은 아마도 웹페이지의 상태 변경이 뷰에 반영되지 않아서 발생할 수 있습니다. 이는 주로 상태 관리를 제대로 하지 않아서 발생하는 경우가 많습니다.
이러한 문제를 해결하기 위한 대중적인 해결 방법은 다음과 같습니다:
상태 관리 라이브러리 사용:
Redux,MobX, 또는Context API등 상태 관리 라이브러리를 사용하여 상태를 전역적으로 관리하고, 상태가 바뀔 때마다 뷰가 업데이트되도록 합니다.상태의 불변성 유지: React는 상태 변경을 감지할 때 얕은 비교를 하기 때문에 상태가 변경되었음을 React가 알아차리게 하려면 상태를 불변하게 유지하는 것이 중요합니다.
immer라이브러리를 사용하면 상태의 불변성을 쉽게 관리할 수 있습니다.React Hooks의 적절한 사용:
useEffect나useCallback을 적절히 사용하여 상태나 prop이 변할 때마다 필요한 작업을 수행하고, 적절히 리렌더링이 되도록 합니다.
관련된 게시물을 확인하실 수 있는 링크는 다음과 같습니다:
- DM 채팅하기 질문드립니다.
이 게시물에서는 useCallback을 통해 상태 변경 시 리렌더링이 제대로 되지 않는 경우와 상태의 불변성을 유지하는 것에 대한 해결 방법을 제시하고 있습니다.
혹시 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
기본 셋팅과 관련하여
0
90
1
초기 셋팅 back과 front만 남겨두고 다 지운 후 진행 방법
0
95
2
useEffect 개수 관리
0
108
2
라이브러리 서치 방법
0
103
2
함수 정의 패턴
0
77
1
npm run dev 에러
0
151
3
npx webpack 후 에러
0
177
2
'void' 형식 식의 truthiness를 테스트할 수 없습니다.ts(1345)
0
142
2
사용자 가입시 에러발생 (TypeError: Cannot read properties of null (reading 'addMembers')
1
176
2
초기세팅중 packge.json 에러떠요
0
154
2
CORS - Access-Control-Allow-Origin 누락 문제
0
426
3
로그인 페이지 무한 새로고침 현상
0
598
2
Module not found: Error: Can't resolve './App' 에러
0
949
1
배포 방법
0
295
2
npm run dev 시 빌드가 매우 느려졌습니다
0
985
2
alias 경로 설정 오류
0
446
2
fetcher 함수의 data 값이 두번 찍히는 이유
0
273
1
제네릭 질문
0
216
2
ts-node 대신 tsx 사용여부
0
373
1
배포 관련 질문
0
243
1
[nginx + https] 서비스를 실행하면 niginx가 아닌 서비스 화면을 보여주게 하고 싶습니다.
0
382
2
[배포하기] webpack에 aws 퍼블릭 IPv4 주소 와 포트 주소를 작성하고 나서 빌드후 실행하면 오류가 발생합니다.
0
332
1
users 호출 시 쿠키가 담기지 않는 이슈 질문드립니다.
0
244
2
CORS 에러 질문입니다.
0
263
1