You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
#612 에 이어 View 성능 최적화 팀에서 어제(08/06(화) 20:30) 회의했던 내용을 공유드립니다.
수치적인 성능 테스트 이외에도 렌더링 이슈를 탐색해보았습니다.
테스트 환경
Dev 모드 기준
크롬 브라우저의 React Dev Tools extension으로 진행
문제
리렌더링 되는 컴포넌트를 Highlight 해본 결과, 하위 컴포넌트의 상태가 바뀌어도 전체가 리렌더링 되는 모습이 있었습니다.
원인 분석
전역 context provider의 상태 관리 문제
현재의 githru는 GlobalDataProvider에서 모든 전역상태를 관리하고 있고, 해당 컴포넌트가 전체 App을 감싸고 있는 구조입니다.
따라서 전역상태가 변화하게 되면 GlobalDataProvider의 자식컴포넌트인 App이 전부 리렌더링 되기 때문에 위의 문제가 일어납니다.
결론
성능 최적화 팀 회의 결과, 전역 상태 관리 라이브러리 도입 및 상태를 기반으로한 리팩토링을 진행하려 합니다.
전역 상태 관리 라이브러리는 다음 회의를 통해 리스트업 하고 각각의 장단점을 정리하여 다시 issue를 올리도록 하겠습니다.
😎위 내용과 관련해서 많은 의견 부탁드립니다😎
The text was updated successfully, but these errors were encountered:
#612 에 이어 View 성능 최적화 팀에서 어제(08/06(화) 20:30) 회의했던 내용을 공유드립니다.
수치적인 성능 테스트 이외에도 렌더링 이슈를 탐색해보았습니다.
테스트 환경
문제
원인 분석
현재의 githru는
GlobalDataProvider
에서 모든 전역상태를 관리하고 있고, 해당 컴포넌트가 전체App
을 감싸고 있는 구조입니다.따라서 전역상태가 변화하게 되면
GlobalDataProvider
의 자식컴포넌트인App
이 전부 리렌더링 되기 때문에 위의 문제가 일어납니다.결론
성능 최적화 팀 회의 결과, 전역 상태 관리 라이브러리 도입 및 상태를 기반으로한 리팩토링을 진행하려 합니다.
전역 상태 관리 라이브러리는 다음 회의를 통해 리스트업 하고 각각의 장단점을 정리하여 다시 issue를 올리도록 하겠습니다.
😎위 내용과 관련해서 많은 의견 부탁드립니다😎
The text was updated successfully, but these errors were encountered: