Workbox

Next PWA는 Workbox를 사용한다. 이 Workbox에 대해서 알아보자.

워크박스란 PWA의 캐싱 기능을 편하게 구현할 수 있도록 지원되는 표준 PWA 라이브러리이다.

아래와 같은 기능을 제공한다.

Precaching: 웹 애플리케이션을 접속하기 전에 미리 캐싱해놓는 캐싱 방법.
Runtime Caching: 웹 애플리케이션을 동작 시킬 때 발생하는 요청에 대해 서버 응답을 캐시 스토리지에 저장하는 캐싱 방법. 보통 이미지와 같은 리소스는 파일 용량이 커서 처음 페이지 접속할 때 서비스 워커 설치 시간이 길어지므로 런타임 캐싱으로 하는게 좋다.
Strategies
Request Routing
Background Sync
Helpful debugging

import { skipWaiting, clientsClaim } from 'worbox-core';

skipWaiting과 clientsClaim이라는 함수가 보인다. 서비스 워커는 최초 등록된 후 다음 로드시까지 이를 사용하지 않는다. 하지만 skipWaiting과 clientsClaim을 적용한다면, 해당 페이지를 즉시 제어한다.

skipWaiting은 workbox에서 사라질 것이라고 한다. 대신 서비스워커에서 self.skipWaiting()을 사용한다.

참고

skipWaiting과 clientsClaim이라는 함수를 사용하면 해당 페이지를 즉시 제어한다.