Service Worker의 생명주기와 업데이트가 즉시 반영되지 않는 이유를 설명해주세요.
답변 포인트
install, waiting, activate 단계와 기존 탭이 열려 있는 상황을 생각해보세요.
정답 및 해설
빠른 요약
Service Worker는 웹 페이지와 별도의 스레드에서 동작하며 네트워크 요청 가로채기, 캐싱, 푸시 알림 같은 기능을 제공합니다. 생명주기는 대략 install → waiting → activate 흐름입니다.
Service Worker는 웹 페이지와 별도의 스레드에서 동작하며 네트워크 요청 가로채기, 캐싱, 푸시 알림 같은 기능을 제공합니다. 생명주기는 대략 install → waiting → activate 흐름입니다.
새 service worker 파일이 발견되면 브라우저는 먼저 install을 수행합니다. 하지만 기존 service worker가 제어 중인 페이지가 아직 열려 있다면 새 worker는 바로 activate되지 않고 waiting 상태에 머무를 수 있습니다. 사용자가 모든 탭을 닫거나, 개발자가 skipWaiting과 clients.claim을 사용해야 새 worker가 빠르게 제어권을 가져옵니다.
업데이트가 즉시 반영되지 않는 이유는 사용 중인 페이지의 캐시 전략과 실행 중인 service worker를 갑자기 바꾸면 일관성이 깨질 수 있기 때문입니다. 예를 들어 HTML은 새 버전인데 JS chunk는 예전 캐시를 참조하는 상황이 생길 수 있습니다.
그래서 PWA에서는 업데이트 UX가 중요합니다. “새 버전이 있습니다. 새로고침하세요” 같은 안내를 띄우거나, 안전한 시점에 reload하도록 설계합니다.
면접에서는 Service Worker가 단순 캐시 파일이 아니라 “브라우저에 설치되는 프록시 계층”에 가깝다고 설명하면 이해가 쉽습니다.