[TIL] 5월 5일 기록

오늘의 할 일

✅ 📌 어제자 TIL - [내일 할 일] 확인

✅ 📌 ~20:00 팀 데일리 미션 출제

✅ 📌 ~다음날 06:00 팀 데일리 미션 답변

✅ 📌 TIL 작성

 

오늘의 나는 무엇을 잘했을까?

• 계속 페어프로그래밍 꾸준히 진행!

 

오늘의 나는 무엇을 배웠을까? ⭐(중요체크)

멘토링

• strict mode는 프로젝트 단에서 미리 에러를 detect하기 위한 용도일 뿐, 모든 에러를 찾아내진 못한다.
• setState 외부에서 호출할 땐 리렌더링이 안되더라도 항상 에러를 발생시키는 것 같다. setState는 컴포넌트 최상위에선 쓰지 말자!
• 버츄얼 돔이 공식적인 명칭은 아니고, DOM이랑 비슷한 자료구조이고, 이걸 js에서 변수로 써서 그런 맥락으로 버츄얼 돔이라 통용적으로 부름.
• critical rendering pass: html ,css 파일을 다운받아 화면에 띄우기 까지의 과정
• 실제 돔노드를 직접 변경하면 레이아웃이랑 paint를 무조건 수행하면서 추가적인 동작이 들지만, 버츄얼 돔에선 js 객체로 따로 만들어놓고, 그 안에서만 값을 변경하는 것은 단순 연산이기 때문에 최적화됨. 그래서 화면 변경을 많이 하는 경우엔 버츄얼 돔을 이용하는 것이 더 효율적이다. → 단순한 웹사이트라면 굳이 둘의 차이는 없음
• 버츄얼 돔을 계속 add를 모아서 commit하는 것과 비슷하게 생각
• ref와 일반 변수의 차이: 이 컴포넌트 파일을 여러 군데서 쓸 경우, 컴포넌트 외부에 선언한 변수를 여러 군데서 모두 공유할 수 있음. 하지만 ref는 독립적으로 관리되기 때문에 그런 차이점이 있다. 또 ref는 렌더링 이후에도 초기화되지 않고, 직전에 업데이트된 값이 유지되지만 일반 변수는 그러지 못함.
• useEffect같은 훅에 디펜던시로 넘겨줄 때, 함수의 레퍼런스를 유지해야 할 땐 useCallback을 필수로 씀. useMemo는 똑같이 디펜던시를 갖고 있는데, 디펜던시 리스트의 값이 바뀌지 않으면 콜백 안에 있는 계산을 안함. 즉 추가적인 계산을 안함. ← dp랑 비슷한 맥락. 하지만 useMemo는 추가적인 메모리가 들어서? 되도록이면 사용하지 말고, 속도가 느리다 싶을 때 속도가 느린 원인을 찾다가 끝내 못찾으면 그 때 useMemo를 쓰도록. → 레퍼런스 유지가 필요할 땐 필수적으로 useCallback을 쓰되, 두 훅 다 추가적인 메모리가 들어서 무조건적으로 쓰는 것은 X
• 프로젝트 디렉토리 구조를 어떻게 해야할지 모르겠다 → 실제 서비스와 비슷한 규모의 프로젝트를 보고 참고하자 .ex) velopert
• yak shaving: 뭔가 할려고 할 때, 그거에 대한 일들을 끊임없이 만들 수 있는데, 거기에 대한 멘토님의 생각은 좀 더 실용적인 측면에서 접근하자!