Chunho’s DevLife

CloudFront S3 이미지 무효화와 적절한 프론트 캐시 정책 조사

테스트 시나리오를 통한 기존 이미지 캐시 동작 확인이미지 네트워크 요청 시 응답 헤더 확인 -->캐시 관련 헤더를 확인해 본 결과etag:"example"last-modified: Thu, 27 Feb 2025 06:26:56 GMTx-cache: Hit from cloudfrontvia: 1.1 example.cloudfront.net (CloudFront)x-amz-cf-id: examplex-amz-cf-pop: ICN57-P5서울 리전 (ICN)엣지 로케이션 사용 CloudFront의 캐시 정책을 따르고 있으며, Cache-Control 헤더 부재를 통해 브라우저의 캐시 정책은 명확하지 않고 브라우저 기본값에 의존하고 있는걸로 확인되었다.기본적으로 CloudFront의 캐시 설정 우선순위가 더 높..

문제상황기본적으로 현재 진행중인 프로젝트에서 유저가 보유하고 있는 선수 카드 리스트는 최적화를 적용해 앱 진입 시점에 한 번 받은 뒤 캐싱해서 사용한다. 이후 리스트에 업데이트가 있을 경우 해당 부분만 새로 업데이트해주는 전략을 가져가고있다. 선수카드는 만 장이 넘어가게 소유할 수 있고, 개별 카드의 이미지도 무겁고 리소스가 큰 탓에 메모리, 네트워크 요청에 많은 부담이 있을 수 있어 위와 같은 정책을 선택했고 렌더 또한 가상화 라이브러리를 사용해서 스크롤에 따라 필요한 순간 동적으로 렌더하고 있었다.하지만 마찬가지로 선수 리스트를 보여줘야하는 특정 컨텐츠에서 문제 상황이 발생했다. 해당 컨텐츠에서는 기획상 (언젠간 바꿔야 하는 부분이였지만) 결론적으로 모든 선수 리스트를 한 번에 받아오며, 당시 상황상..

WebView를 사용한 RN 프로젝트에서 ios는 폰트가 제대로 적용되지 않는 이슈가 있었다. 먼저 font-family의 적용 원리를 찾아보았다.font-family 의 원리font-family: [1순위], [2순위], [3순위], [...] 와 같은 원리로 현재 OS 에 있는 폰트가 적용된다고 알고 있습니다. 하지만 이렇게만 알면 안되고 정확한 알고리즘을 알아야 합니다. 알고리즘은 다음과 같습니다.[1순위]의 폰트가 OS 에 있는지 확인한다. 있으면 그것을 바로 적용한다.없으면 웹서버에 정의된 웹폰트가 있는지 확인한다.웹서버에 웹폰트가 있으면 다운을 받고, 없으면 [1순위]의 폰트는 없다 간주하고 [2순위]의 폰트를 검사하기 시작한다.1~3의 작업을 반복한다.문제는 OS에 적용하려고 했던 폰트가 없..