https://stackoverflow.com/questions/62970426/cannot-assign-to-read-only-property-of-object-using-react-with-recoil

Recoil

시도한 것

🐱특정 오브젝트의 밸류값만 수정하려고 하였으나. read only라는 에러와 함께 수정 불가

https://github.com/pmndrs/jotai/issues/167

🐱오브젝트의 오브젝트의 오브젝트를 전부 복사한다면 처리속도가 증가 할 것 같아

→ JSON.Parse(JSON.stringify()) 깊은 복사 사용시 속도가 느리다고 알고있었으나 immer와 비교 테스트 결과 크게 차이나지않았음.

→ 더 개선하려면 재귀함수나, lodash를 사용해봐야 할 듯 싶다.

🐱JSON.Parse(JSON.stringify())를 하니까 웹소켓 객체가 사라짐

→ Primitives는 상관없으나 객체타입에는 조심해야함

Why JSON.parse(JSON.stringify()) is a bad practice to clone an object in JavaScript

테스트코드

const cntRef = useRef(0);
  const immerRef = useRef(0);
  const normalRef = useRef(0);
  useEffect(() => {
    if (message) {
      cntRef.current++;

      const fastJsonBeforeTime = performance.now();
      console.log(produce(userSocket, (draftState) => {}));
      const fastJsonEndTime = performance.now();
      immerRef.current += fastJsonEndTime - fastJsonBeforeTime;
      console.log(
        `immer Cnt :${cntRef.current}`,
        immerRef.current / cntRef.current
      );

      const normalJsonBeforeTime = performance.now();
      console.log(JSON.parse(JSON.stringify(userSocket)));
      const normalJsonEndTime = performance.now();
      normalRef.current += normalJsonEndTime - normalJsonBeforeTime;
      console.log(
        `Normal Cnt :${cntRef.current}`,
        normalRef.current / cntRef.current
      );
    }},[message]}

결과

  1. 속도
    1. 65회 정도 더하고 평균치를 구한결과 immer가 50%정도 느린결과가 나왔다.