Weeeeey Weeeeey

setInterval() 과 useSWR() 은 모두 데이터를 실시간으로 가져오는 방법이지만, 동작 방식과 목적이 다르다. setInterval() setInterval()은 매번 데이터를 가져오기 위해 API에 요청을 보내는 방식이다. 즉, 호출 횟수가 늘어날수록 서버에 부하가 증가한다. 또한 호출 간격을 지정하더라도 정확히 유지하지 못할 수 있고, 데이터를 가져오다 문제가 발생하면 예외가 발생한다. useSWR() useSWR은 데이터를 캐싱하고, 필요에 따라 API에 요청을 보내 데이터를 가져오는 방식이다. 이 방법은 API 요청 횟수가 줄어들고, 가져온 데이터를 캐싱하여 다음 요청시 캐시된 데이터를 리턴함. 호출 실패시에 적절한 에러 처리 가능함 setInterval() && useSWR() =>..

SWR란? HTTP 캐시 무효 전략인 State-While-Revalidate 에서 유래됨. SWR은 캐시로부터 데이터를 반환한 후, fetch 요청(재검증)을 하고, 최종적으로 최신화 된 데이터를 가져오는 전략 SWR을 사용하면 컴포넌트는 지속적이며 자동으로 데이터 업데이트를 경험할 수 있음. Next.js 팀에서 만들었다. 설치 yarn add swr // npm install swr 사용법 import useSWR from "swr"; const fetcher = (url:string)=>{ fetch(url).then(res=>res.json()) } const useUser = () => { const { data, error } = useSWR("/api/users/me",fetcher); r..