기존

기존에는 useEffect로 배열의 크기가 200이 넘어가면 emotions 배열을 전부 초기화 했다. 이렇게 했을 땐 초기화 되기 직전에 사용자가 보낸 이모티콘은 초기화 과정 중에 씹히게 된다.

해결

useRef를 사용하여 emotions의 배열의 현재의 길이를 가져올 수 있게 하여 배열의 크기가 200이 되면 앞의 150개를 자르고 뒤에 50개만 남기게 하여 배열을 최적화도 시키면서 초기화 전 50개의 이모티콘에 대해서도 씹히지 않음을 보장하였다.