Awesome Progressive Web Apps with Angular

on YouTube ↗29m

" summary

Shows a working conference PWA built with Angular that loads and navigates under throttled 3G, survives offline and uses an app shell plus lazy routes to shrink main JS. Gives concrete numbers: browsers see ~14 seconds on bad sites, this app hits Lighthouse 3G meaningful paint ~3.7s; swaps heavy libs for date-fns 9 KB vs moment 335 KB; wires caching via service worker added with ng add @angular/pwa and is hosted on Firebase.

AI-written summary · about

" chapters (31)

1. 0:00Intro
2. 0:43Experiment
3. 1:48Chrome Study
4. 2:46JavaScript
5. 3:22Progressive Web Apps
6. 3:58Responsive Web Design
7. 4:26Key Points of Progressive Web Apps
8. 5:40Demo
9. 8:08Key Points
10. 8:34Ship Less Code
11. 9:04Lazy Loading
12. 9:28App Shell Pattern
13. 10:10CanLoad
14. 10:42Group Routes
15. 11:36Libraries
16. 13:16Budgets
17. 13:53Service Worker
18. 14:13Service Worker 101
19. 14:56Service Worker Library
20. 15:14Service Worker JSON
21. 15:36Service Worker Configuration
22. 16:09Check for Updates
23. 16:33AngularPWA Schematic
24. 16:54Making it Last
25. 17:06App Manifest
26. 17:32Theme Colors
27. 19:28Add manifest to app
28. 21:12Add icons to manifest
29. 21:48Measure app performance
30. 23:27Community Tools
31. 24:57Bad Use Cases

" related talks

• 01h 04mProgressive Web Apps: Cross-Plattform Applications with AngularShmuela Jacobs · iJS 2018
• 01h 04mProgressive Web Apps: Cross-Plattform Applications with AngularShmuela Jacobs · iJS 2018 Spring
• 53mWeb goes Native: Progressive Web Apps with AngularShmuela Jacobs · GDG DevFest Ukraine 2017
• 33mProgressive Web Apps - the Angular waySimona Cotin · Uphill Conf 2018
• 17mProgressive Angular 2 appsCiro Nunes · NG Poland 2016
• 35mProgressive Web Apps with Angular 2Manfred Steyer · Angular Camp 2016
• 31mProgressive Web Apps with Angular and FirebaseErik Haddad · JSPoland Conf 2017
• 26mProgressive Web Apps with Angular and FirebaseErik Haddad · ngVikings 2018