일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
- async
- 캐쉬
- 아키텍처
- CSS-in-JS
- 리액트쿼리
- 비동기
- mockoon
- amplify
- thread
- styled-component
- 목킹
- 최적화
- MSW
- 리액트
- Basic
- Concurrent Mode
- next.js
- 자바스크립트
- React
- link
- mock service worker
- vanilla-extract
- 기본
- react-query
- Cache
- SWC
- front-end mocking
- react server component
- JavaScript
- 개발자
- 리액트네이티브
- 기초
- Babel
- 쓰레드
- react-native
- 동기
- 컴포넌트
- sprinkles
- next hydration
- Critical Rendering Path
- Today
- Total
목록캐쉬 (2)
Don’t worry about failures
평소에 캐쉬에 대해 아무생각 없이 적절한 곳에 캐쉬하면 좋지 라는 생각만 가지고 있었다. 하지만, 이번에 웹 최적화 관련 인강을 들으면서, 캐쉬에 대한 이야기가 나와 정리할 겸 글을 남긴다. 일단, 브라우저의 경우 1. 메모리 캐쉬 2. 디스크 캐쉬 이렇게 두개로 나누어 캐쉬 처리를 한다. 메모리 캐쉬는 RAM에 저장되고, 이는 휘발성이기 때문에 브라우저를 닫았다 키면 날라가게 된다. 반면, 디스크 캐쉬 같은 경우 file로 관리를 한다. 이 두 캐쉬에 대한 선택은 개발자가 직접적으로 관리하지는 못하고 브라우저 내의 알고리즘에 의해 관리가 된다. 하지만 이 캐쉬에 대해 사용할지 말지 유효기간이 어떻게 되는지 등의 옵션은 cache-control을 통해 관리할 수 있다. 이는 서버 요청 후 respons..
사이드 프로젝트를 하면서 react query를 적용해보기로 했다. 적용하게된 계기 1. 캐싱 작업 2. 서버 상태 관리 위와 같은 이유로 해당 라이브러리를 찾아보기 시작했다. 1. react query 2. swr 3. apollo 위와 같은 라이브러리가 존재했다. 모든 라이브러리를 비교 분석하기엔 어려움이 있었기 때문에. 간략하게 비교 분석이 된 것을 보고, react query를 선택했다. 그리고 이를 계속해서 파악해보았을 때 적용하는 데에 부족함이 없다라고 생각했기에 택하게 되었다. https://react-query.tanstack.com/comparison 훅과 같이 리액트 스럽게 사용할 수 있는 장점. 손쉽운 키로 캐쉬 관리 및 업데이트 등과 함께 서버 상태 관리를 직관적으로 표현. 이러한 ..