{"id":62915,"date":"2018-01-29T00:00:00","date_gmt":"2018-01-29T00:00:00","guid":{"rendered":"http:\/\/blog.mozilla.org\/foxtail\/2018\/01\/29\/progressive-web-apps-whats-big-deal\/"},"modified":"2018-01-29T00:00:00","modified_gmt":"2018-01-29T00:00:00","slug":"progressive-web-apps-whats-big-deal","status":"publish","type":"post","link":"https:\/\/blog.mozilla.org\/en\/firefox\/progressive-web-apps-whats-big-deal\/","title":{"rendered":"Progressive Web Apps are here. What\u2019s the big deal?"},"content":{"rendered":"

The web is the largest software platform ever, a great equalizer that works on any device, anywhere. The more it can do, the better off we\u2019ll be. That\u2019s the thinking behind Progressive Web Apps (PWA), mobile-friendly websites that can do almost everything native apps can do, and they\u2019re coming<\/a> to Firefox for Android.<\/p>\n

\"Progressive<\/p>\n

Why You Should Care<\/b><\/h3>\n

Mobile apps can take up a lot of storage space on your phone. Your phone is probably bursting at the seams with apps. Progressive Web Apps take up far less space, on average, and they could save you a significant amount of storage and bandwidth (from downloading apps). You won\u2019t need to download an app to get all the killer features like notifications, location services, offline support, etc. Your mobile browser could become the nexus of everything you do on your phone. It could open up software development like nothing before it, and chances are, it will. All the major mobile browser makers are launching support for PWAs (including us) and it\u2019s likely that they\u2019ll gain more features in the future.<\/p>\n

How PWAs Work<\/b><\/h3>\n

Progressive Web Apps are built on web standards called Service Workers, HTTPS, and Web App Manifests. Service Workers let developers build websites that can work when there\u2019s no network. The Web App Manifest lets users do things like pin the app to their home screens, or interact with web apps as if they were native. The point is to create something that will work when there\u2019s no internet connection, and make it possible to launch it right from the Home screen, just like a native app.<\/p>\n

What PWAs Can Do<\/b><\/h3>\n

According to a 2017 U.S. Mobile App Report by comScore<\/a>, the web reaches three times as many people as mobile apps. But people use mobile apps on their devices far more than than mobile browsers. The results are clear: On mobile, apps rule. Why? Apps are fast and robust. They offer push notifications, full integration with other apps (and the web), location services, and more. That means if you want to reach people, you should probably build native apps in addition to mobile-ready websites. It\u2019s a lot of work, and it would be easier if you could just build one website that does everything really well.<\/p>\n

And some sites have. The Financial Times abandoned their native apps in favor of a robust PWA at app.ft.com<\/a>. It can be saved to a device\u2019s home screen and users can save articles to read offline. Forbes has also moved to PWAs to deliver content. Forbes says it\u2019s easier for users to visit the Forbes site and install their PWA than it is for them to download an app from an app store. Since moving to PWAs, Forbes has seen a 43 percent increase in users, and those users stay twice as long. Lyft and Uber have also launched PWAs aimed at users with limited data bandwidth and connectivity. The sites do everything the apps do, but within the browser.<\/p>\n

Starbucks released their PWA in 2017. They wanted an app that could do everything and work on any device with a web browser, in areas with poor data service. Today customers can browse the Starbucks menu and place and customize orders through the Starbucks PWA.<\/p>\n

PWAs can use device features like cameras, data storage, GPS and motion sensors, face detection, and more. This will pave the way for AR and VR experiences, right on the web. Imagine being able to redecorate your home virtually using nothing but your phone and a PWA. Pan your camera around a room, then use tools on a website to change wall colors, try out furniture, hang new artwork, and more. It may feel like a futuristic fantasy, but it\u2019s close to reality.<\/p>\n

How do you use PWAs?<\/b><\/h3>\n

Using a PWA is as easy as visiting a website. Crack open Firefox for Android and visit the site\u2014it\u2019s that easy. If the site is running as a PWA, a badge will appear in the address bar. Tap the icon and an \u201cAdd to home screen\u201d confirmation will appear. The PWA will act just like any other app on your phone\u2014it\u2019ll appear as a separate app in the app switcher and will work offline (if supported).<\/p>\n