Detail페이지에서 연결되는 소켓은 모든 종목의 코인거래정보를 받아오기 때문에 짧은 간격에 많은 데이터가 서버로부터 전송된다.
실시간 코인가격정보를 나타내는 컴포넌트에 모든 데이터를 바로 반영하지 않고 일정 간격으로 데이터를 모았다가 한번에 렌더링에 반영하여 렌더링횟수를 줄인다.
Detail페이지의 우측 상단의 코인 상세정보페이지는 페이지의 path가 바뀌기 전까지 업데이트 될 필요성이 없다.
캔들차트와 실시간 코인가격정보를 나타내는 컴포넌트가 소켓을 통한 실시간 통신이 필요하기때문에 페이지에서 소켓을 사용하는 커스텀훅을 사용하였고 소켓을 통해 해당 커스텀훅이 반환하는 정보에 따라 지속적으로 업데이트 되는 문제를 Memo를 활용하여 최적화
요약
Detail페이지에서 연결되는 소켓은 모든 종목의 코인거래정보를 받아오기 때문에 짧은 간격에 많은 데이터가 서버로부터 전송된다.
실시간 코인가격정보를 나타내는 컴포넌트에 모든 데이터를 바로 반영하지 않고 일정 간격으로 데이터를 모았다가 한번에 렌더링에 반영하여 렌더링횟수를 줄인다.
Detail페이지의 우측 상단의 코인 상세정보페이지는 페이지의 path가 바뀌기 전까지 업데이트 될 필요성이 없다.
캔들차트와 실시간 코인가격정보를 나타내는 컴포넌트가 소켓을 통한 실시간 통신이 필요하기때문에 페이지에서 소켓을 사용하는 커스텀훅을 사용하였고 소켓을 통해 해당 커스텀훅이 반환하는 정보에 따라 지속적으로 업데이트 되는 문제를 Memo를 활용하여 최적화
기존에 작성되어있던 볼륨기능 추가해보고 부하 확인해보기
백엔드 서버의 불필요한 dataSample디렉토리 삭제
예상 작업 내용 (커밋단위)
이슈가 완료된 후 (TOBE)
Detail페이지의 렌더링횟수가 줄어들어 성능이 좋아질 것으로 기대