react17 React.memo vs useMemo vs useEffect https://medium.com/hcleedev/web-%EC%B5%9C%EC%A0%81%ED%99%94%EC%99%80-react-memo-usememo-%EC%95%8C%EC%95%84%EB%B3%B4%EA%B8%B0-4324a237a039 을 보고 정리한 글입니다. React 에는 memoization 이라는 개념을 활용한다. memoization 이란 특정 함수가 동작하고 반환된 그 결과물을 기억하고 있는 것이다. function sum(a, b) { return a + b; } 위의 함수에 memoization 을 적용하면, 처음 누군가 sum(1, 2)를 호출했다면 sum을 a: 1, b: 2와 호출했고, 3이 반환되었다 라는 정보를 기록해둔다. 그러고 다시 반복되어서 sum(1, 2) 를 .. 2023. 3. 24. React 에서 주의해야하는 Event 와 addEventListener 원본글 https://medium.com/hcleedev/web-event%EC%99%80-addeventlistener-%EC%95%8C%EC%95%84%EB%B3%B4%EA%B8%B0-%EA%B0%9C%EB%85%90-react%EC%97%90%EC%84%9C-%EC%A3%BC%EC%9D%98%ED%95%A0-%EC%A0%90-a581adc49aa4 https://joonior.tistory.com/96 https://babycoder05.tistory.com/entry/React-useEffect%EC%99%80-addEventListener-window-%EC%9D%B4%EB%B2%A4%ED%8A%B8-%EB%A0%8C%EB%8D%94%EB%A7%81-%EA%B7%9C%EC%B9%99 Event .. 2023. 3. 24. [SWR] SWR 동작 시나리오 https://swr.vercel.app/ko/docs/advanced/understanding Understanding SWR – SWR SWR is a React Hooks library for data fetching. SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally comes with the up-to-date data again. swr.vercel.app 최근에 swr 이해 문서가 업데이트 되었다. 일부 내용을 한번 살펴보자 useSWR 은 data,error,isLoading..및 stateful한 값을 반환합니다. 이러한 값들을 반환하는 시나리오를 설명합니다.. 2023. 3. 22. [SWR] useSWR 장점 https://swr.vercel.app/ko 현재 우리 프로젝트에서 쓰고있는 data fetch react hook. 도입되자마자 구현하느라, 공부해볼 시간이 없었다. 이참에 정리해보고자 한다. 장점 1. Cache Stale-While-Revalidate 의 줄임말로 백그라운드에서 캐시를 revalidate(재검증) 하는 동안에 기존의 캐시 데이터를 화면에 보여준다. 그래서, 도중에 api가 에러를 반환하더라도 캐시된 데이터를 활용할 수 있다. 즉, 좋지않은 데이터로 인해 일어나는 불필요한 렌더링을 막아준다. 2. 중복제거 불필요한 api 호출을 막음 SWR은 전역캐시를 이용해 모든 컴포넌트 사이에 데이터를 저장하고 공유한다. 그러므로, 불필요한 네트워크 요청을 생략한다. user 정보를 가져오는 h.. 2023. 3. 22. 이전 1 2 3 4 5 다음 728x90 반응형
