Creating an Angular Progressive Web App: which option will work better for you?

on YouTube ↗25m

" summary

Compares two concrete options and shows what actually works: using Angular CLI 1.6 to generate an app produces ngsw-worker.js and ngsw.json that enable an offline app shell after a production build, runtime caching with prefetch versus lazy groups, and data groups with freshness or performance strategies. Demonstrates push by sending a payload wrapped in a notification field, exposes the SWUpdate observable for prompting reloads, and gives a kill switch (remove ngsw.json) plus practical hacks for update timing and debugging.

AI-written summary · about

" chapters (19)

1. 0:00Intro
2. 0:25Maxim Salnikov
3. 1:5910 characteristics
4. 3:58Generate a new Angular PWA
5. 6:46Adding NGSW to the existing app
6. 7:28Service worker build support in the CLI
7. 8:57NGSW configuration file
8. 10:29App shell resources
9. 11:08App shell / on-demand
10. 12:12Runtime caching
11. 14:59Push notifications / send
12. 15:57App version updates
13. 17:10Check for updates
14. 18:10Debugging update flow
15. 20:31Checking the status
16. 20:46Kill switch
17. 22:20Main available features
18. 22:32Angular Service Worker advantages
19. 23:14On the roadmap

" related talks

• 24mBuild progressive web apps with AngularSimona Cotin · Frontend Developer Love 2018
• 22mAutomatic Progressive Web Apps using Angular Service WorkerMaxim Salnikov · AngularConnect 2017
• 29mBuild progressive web apps with AngularSimona Cotin · ngVikings 2018
• 43mAutomatic Progressive Web Apps using the Angular Mobile ToolkitMaxim Salnikov · JSHeroes 2017
• 35mProgressive Web Apps with Angular 2Manfred Steyer · Angular Camp 2016
• 33mProgressive Web Apps - the Angular waySimona Cotin · Uphill Conf 2018
• 54mBuilding an Angular PWA: Angular Service Worker or Workbox?Maxim Salnikov · iJS 2018 Spring
• 32mBuilding an Angular PWA Angular Service Worker or Workbox?Maxim Salnikov · Angular Connect 2018