Angular PWAs: Your Anchor in the Digital Ocean | Ankita Sood | ng-conf 2024

Learn how Progressive Web Apps modernize Angular applications with offline capabilities, cross-platform support, and native-like features - without separate codebases.

Key takeaways
  • Progressive Web Apps (PWAs) provide a middle ground between native apps and traditional websites, offering better performance and user engagement
  • Converting an Angular app to PWA is straightforward using ng add PWA, which adds service worker and manifest files
  • PWAs can work offline through caching APIs, providing seamless experience even with spotty internet connections
  • 38% of PWA sessions were recorded on desktop, showing PWAs aren’t just for mobile devices
  • Users prefer not to download native apps for single tasks - 50% would rather use a website on their phone
  • PWAs solve the software distribution problem by eliminating the need to maintain separate codebases for web, iOS, and Android
  • Key PWA features include:
    • Installation capability
    • Offline access
    • Push notifications
    • Responsive design across devices
    • Background task processing
  • PWAs reduce development overhead as only one codebase needs to be maintained versus multiple for native apps
  • Performance optimization in Angular PWAs can be achieved through:
    • Defer loading components
    • Conditional rendering based on device/screen size
    • Service worker caching
  • Major platforms like GitHub and YouTube are offering PWA versions of their applications