PWA 생명주기

읽기 전에...

이 글은 pwa를 막 접한 세미 개발자가 쓴 글로 오류가 있다면 댓글로 혼내주시면 감사하겠습니다.

PWA의 serviceWorker.js

pwa의 시작이자 꽃이라고 할 수 있는 serviceWorker가 어떤 경로로 등록되고,

삭제되는지 알아보자.

다운로드

navigator.serviceWorker.register를 사용하고 나면 새로운 서비스 워커를 등록할 때 마다, 자바스크립트가 다운로드되고 파싱되고 나면, 서비스 워커는 설치중 상태에 들어서게 됩니다. 설치가 성공적으로 이루어지면 다운로드 완료 상태가 되고, 에러가 발생하면 페이지를 새로고침하여 다시 등록하거나, 중복 상태에 빠져들게 됩니다. 중복상태 시에는 아에 스크립트를 사용할 수 없게 됩니다.
만약 다운로드중 상태를 오래 유지해야 한다면, event.waitUntil()을 사용하면 된다.

다운로드됨 / 대기 중

서비스 워커가 정상적으로 설치되어서 "다운로드됨"상태로 넘어가게 된다.
만약에 실행중인 서비스워커가 없다면 "활성화"로 바로 넘어가게 되지만 실행중인 서비스 워커가 있다면 "대기중"에 머물게 된다.

활성화중

서비스 워커가 활성화 되기 직전의 이벤트이다.
이 때도 활성화 상태를 오래 유지하기 위해서는 evemt.waitUntil() 을 사용하자.

활성화 됨

서비스 워커가 활성화되면, 페이지를 제어하고 fetch 이벤트와 같은 동작 이벤트를 받을 준비가 된다.
서비스 워커는 페이지 로딩이 시작되기 전에만 페이지 제어 권한을 가져올 수 있다.