Building an Angular PWA Angular Service Worker or Workbox?
summary
Clear comparison of two concrete workflows: one-line setup with Angular CLI that generates ngsw.json and copies ngsw-worker so an app goes offline in the demo, versus a Workbox build script that adds workbox-build as a devDependency and runs injectManifest via workbox-build to populate a src/service-worker. Covers update UX (Angular provides SWUpdate observable; Workbox can use broadcast update (Chrome and Firefox only) or service worker lifecycle events), caching strategies, manual registration, push format requirements, and what actually needs coding.
AI-written summary · about
chapters (17)
- 0:00Intro
- 2:22Cross-platform?
- 3:45UX advantages?
- 6:58Let's build an App shell
- 9:17Automation
- 11:03Configuration file
- 13:05Working modes
- 14:23Build script configuration
- 14:58Source service worker
- 15:59Build flow integration
- 17:11App version updates
- 19:15Hint: Provide a version description
- 20:56Option #2: Service worker lifecycle
- 21:47Requirements
- 23:48register-service-worker
- 26:15Configuring strategies
- 27:11Hint: Support API versioning
related talks
54mBuilding an Angular PWA: Angular Service Worker or Workbox?
47mSending the Angular app into deep, deep offline with Workbox
38mSending your Angular App into deep, deep offline with Workbox
52mMany Frameworks – One PWA Solution
43mAutomatic Progressive Web Apps using the Angular Mobile Toolkit
33mAngular and Service Workers
22mAutomatic Progressive Web Apps using Angular Service Worker
17mHow to build a PWA and stay sane: Introduction to Workbox