렌더링 될 때마다 socket.io connect 오류

안녕하세요 슬랙 코딩을 바탕으로 응용하여 줌을 만들어보자 하고있습니다. 줌에는 레이아웃에 여러가지 버튼이 존재하는데 해당 버튼을 누르면 state 값이 변경되면서 랜더링이 발생하며 socket 메시지를 주고 받는데 이때 기존에 연결되었던 connection 말고 다른 connection이 연결됩니다.

해당 부분을 해소하기 위하여 지금 슬랙에 나와있는 use소켓 훅함수의 디스커넥트를 사용하여 해결하고자 하였으나 소켓 통신에는 문제가 없으나 소켓서버에는 룸에 접속하지 않은 채 커텍트되어있는 상태로 남아있는 것을 확인했습니다. 

즉 한번 소켓이 커넥트되고 나서 랜더링이 있을 때 마다 해당 부분 소켓 커넥트 함수가 랜더링이 되면서 소켓 서버에 로그를 찍어보면 커넥션 상태로 대기하게 되는 현상입니다

만약 이상태로 소켓을 진행하면 소켓 메시지가 한번이  아니라 여러차례가 전송됩니다.. 해결할 수 있는 방법이 있을까요

기존에 소켓이 있으면 새로운 소켓을 생성하지 않고 기존 소켓을 리턴하면 됩니다.

https://github.com/ZeroCho/sleact/blob/master/front/hooks/useSocket.ts#L6

그래서 제 코드에도 이렇게 소켓을 캐싱해놓은 부분이 있었습니다. 그래서 useSocket을 호출할 때마다 소켓이 생성되지 않습니다.