🙆‍♀️ FE/Performance

하고싶은 거 다하며 살자
[✨Refactor] Prefetch 와 hydration으로 SSR 적용하기
📌 Next를 왜 사용할까?React 대신 Next를 사용하는 이유를 생각해 보았을 때, 가장 먼저 떠오르는 것은 SSR이라고 생각한다. 하지만 SSR 때문에 Next를 사용하는 건 아니라고 생각한다. SSR은 React에서도 가능하기 때문이다. 그렇다면 다른 이점이 어떤 것이 있을까? Next는 React를 확장한 프레임워크이기 때문에 여러 다양한 기능들을 제공하고 있다. 폴더 기반의 간편한 라우팅, 다양한 렌더링 전략, 코드 스플리팅 자동화 등등 개발자가 빠르게 사용할 수 있고 편리하게 접근할 수 있는 도구들을 제공해준다. 이외에도 여러 이미지, 폰트 최적화 기능을 제공하는 점 또한 장점이라고 생각한다. 즉, 리액트에 프레임워크적인 성격을 심어주는 것이 Next다 라고 생각하면 좋을 것 같다.   ..
[✨Refactor] React Query 로 효율적으로 캐싱처리하기
📌 캐싱이란?서버에서 어떤 데이터를 불러온 후에 그 데이터를 불러온 저장소보다 가까운 곳에 임시로 저장하여, 필요시 빠르게 불러와 사용하는 프로세스를 의미한다.메모리 계층 구조에서 캐시는 디스크나 메인 메모리보다 더 빠르게 데이터를 불러와서 사용해야 할 때 쓰인다.캐싱된 데이터를 사용하면 동일한 요청이 반복적으로 서버에 요청되지 않는다. 이는 네트워크 트래픽을 줄이고, 서버와 클라이언트 간의 왕복 시간(RTT, Round Trip Time)을 단축시킨다. 더 빠른 속도로 데이터를 제공할 수 있다는 의미이다. 이는 즉 사용자 경험을 개선할 수 있기 때문에 캐싱을 잘 활용하는 것이 중요하다.현재 작업중인 Next 프로젝트의 성능을 더 개선시킬 수 있는 방법이 없을까 고민하다가 캐싱에 대해서 공부도 하고 개..
wnwlals13
'🙆‍♀️ FE/Performance' 카테고리의 글 목록