Next.js 서버 인스턴스 배포할때 나타나는 화이트아웃 현상 트러블 슈팅
정적 자원을 assetPrefix 옵션을 사용해서 별도의 CDN에 업로드해서 배포 개정이 이루어져도 자원을 찾지 못하는 문제를 인프라 구조를 개선해서 해결한 내용입니다.
한 번 받은 것을 다시 쓰는 방법입니다. 쿼리 캐시의 키와 수명, 서비스 워커와 CDN이 어디까지 맡는지 확인합니다.
모든 태그 보기정적 자원을 assetPrefix 옵션을 사용해서 별도의 CDN에 업로드해서 배포 개정이 이루어져도 자원을 찾지 못하는 문제를 인프라 구조를 개선해서 해결한 내용입니다.
Web Worker로 무거운 연산을 옮기고 작업과 취소를 관리하는 방법을 설명합니다. 탭 간 통신, Service Worker의 생명 주기, 캐시와 업데이트 설계도 함께 다룹니다.
GA·Meta Pixel의 초기화가 늦어 이벤트가 유실되는 원인을 설명합니다. 스크립트 실행 시점을 짚고, FIFO 큐·청크 분리와 캐싱·next/script·Web Worker의 적용 조건을 비교합니다.
TanStack Query가 쿼리 키를 해시로 바꾸고 캐시를 조회하는 과정을 소스 코드로 따라갑니다. 부분 매칭·구조적 공유·하이드레이션에서 값이 달라지는 조건도 살펴봅니다.