All you need to know about PWA (Progressive Web Apps)

All you need to know about PWA (Progressive Web Apps)


– So, have you heard a lot about progressive web apps and Microsoft? What’s the deal with it? Well, today we’ll do a deep
dive and answer a lot of questions submitted by a user. Stay tuned. (rock music) Alright, so what is exactly a PWA? Well, the idea goes back to
2015 in an article written by Alex Russell who is a Google engineer. In there, he outlined the requirements for progressive web applications. Since then, the whole
industry has been working towards PWAs by integrating
this into their browsers. So, Google Chrome supports
it know and Edge will be supporting it in Redstone4
and, yes, even Safari is getting a version of it in
11.3, later on this year. Now, what makes a progressive
web app unique is its ability. So, for the first time, these
web applications can work offline and in the background,
and that’s done through a thing called service workers. And, you’ll hear a lot of these. You can think of them as little guys that work in the background. They pull in notifications. It also caches material, and
that’s how it works offline. There is also no Chrome here, meaning not the Chrome browser,
but when you launch a PWA, it doesn’t look like
you’re in the browser. It looks like it’s an application. It’s actually kinda eery how it works, but you don’t get the browser controls, it’s just standard web application stuff. That’s what makes these
things really compelling is when you’re using ’em, it’s really hard to tell the difference. For instance, Instagram have a PWA. So, if you go to instagram.com
on your Android phone, assuming it’s a modern
one, and you log in, you’ll be asked if you want to pin this to your start screen or
your application screen and would you like to
receive notifications. Once you do that and then
you open that app, it looks just like the regular
Instagram application. In fact, the scrolling is
better then a native app of Android which tells you a lot. Why does Google and Microsoft see this as the future of app development? Alright, I’ve talked about
this more in the past before, but let’s rehash some of these ideas. Microsoft, back in build
2015, talked about this idea too that applications
don’t have much longevity. That is, what are called
long-tail applications. Things you launch on occasion. So, I’m not talking about
your email app, necessarily, or things you launch everyday
or heavy things like games. What I mean is, say you wanna
order flowers or you wanna call up an Uber, these are
nice to have as applications, but you’re not using them all the time. It gets real expensive
to maintain these apps. Now, a company like Uber is
really not starved for cash, so let’s put them aside. But let’s talk about
maybe your local diner or your local car shop. Now, on average, it probably
takes around $45,000 to $50,000 if you wanna hire a
dedicated app developer. Now, some work on a
partial fee, per month, to maintain the app, while others just require
a flat out salary. $50,000 a year is not
cheap, at all, especially if you’re a local diner. In fact, that’s kinda cost prohibitive, so it’s very expensive
for small organizations to make an application,
especially if they want to put it on iOS and Android. Remember, most devs
still target iOS first, with Android coming
second, despite the fact that Android is the larger market share. So, this really comes
down to an issue of cost. But, there’s actually a
little bit more going on here. For instance, why is Google pushing this? They have a pretty awesome
store the last time I checked. Well, it’s actually a really good point. Google’s business model,
though, is actually on the web. It’s not really an app store, nor is it selling Android devices. Android is worried
about you getting to use Google services, than going on the web. If every company created
their own native application, and it pulls data direct
from the site without going through the Web, well that actually hurts Google’s bottom line. Don’t forget apps really don’t
count against web traffic. So, Google actually wants
this to happen because, in using a progressive web application, you’re using the web,
you’re using analytics, you’re using their ad stuff. You’re getting everything
that counts against SEO, as well, so it shows up in search. So, this all benefits Google. They don’t really care about
the app store, in that sense. What they want are people back on the Web. So, not only does this
extend the life of the World Wide Web, if you
wanna use a data term, but it actually gives it more life. It gives it actually a new
lease going into 2018-2019. Now, as to why Microsoft wants it, I think it should be pretty obvious. They have the app gap problem and this potentially solves that. How will PWAs affect the Microsoft Store? Alright, so Microsoft
recently talked about this, and it’s really interesting. And, this is the difference with PWAs. Right now, if you’re,
say, on an Android device and you open your Chrome
browser or even Edge browser and you go to twitter.com, like I said, log in, it will ask you
pin it to the app screen. The problem there is you can
still have the Instagram app installed and then have
a PWA installed, as well, living side by side, and there’s sort of a
discoverability issue. Now, I’m not really sure
here what Google’s gonna do, or even Apple’s gonna do
regarding PWAs in their stores, what I can tell you is what
Microsoft is going to do. They’re gonna put PWAs directly into the store and how they do this is through the universal Windows platform. They basically have a
bridge that supports this. So, they’re taking PWA,
wrapping in the appx wrapper, putting into the store, but they also get other features there. For instance, you get live
tiles, you can get Cortana, you can get in-app purchases,
if there were those there. You also get deeper analytics. You get discoverability
because the consumer is gonna basically launch the app
store or the Microsoft store. They’re gonna search for,
say, Uber or Twitter, and guess what’s gonna be there? An application. Now, it’s gonna be technically PWA, but will the consumer know? No, cause there’s no Chrome. They’re not launching it, so it doesn’t look like a web browser, it looks like an application. But, there’s more to this. So, how are you gonna
get PWAs in the store? Do they have to go to each
company and go, can we do this? No, they don’t. Since these are just websites, all they’re doing is putting
websites in the store, they don’t need their permission. And Microsoft has already said they’re gonna use a thing
called Bing Crawler. They’ve been looking at PWA
sites that are live right now and if they meet certain standards, they’re going to be putting these in the store automatically. So, we can expect
probably a couple hundred, I don’t know, maybe even
a thousand of these things to all of a sudden show up in the store. And, then once it gets even more advanced, that is the quality is there,
and they get user feedback, and this is working well, Bing Crawler will be able
to package these things up and put it into the store,
automatically with no one there. Now since no money is
being transpired here, Microsoft is not making money on ads through these things, it’s all just pulling in
a website from a company, there’s no reason there that a
company needs its permission. Twitter is Twitter. If Twitter wanted to
deny a PWA on Windows10, they would be effectively saying, you can’t go to twitter.com
on your web browser, which would be insane. And, so this is the big difference here, Microsoft is treating PWAs
as first-class citizens, as they say. They’re putting them right in the store and it’s going to be there
for users but without the discoverability problem of
having to go to the website, log in and then pin it
to your start screen. It’s a very unique thing
and it should be happening for Redstone4 in the coming weeks. Are there any big name-brand apps out there that are PWAs and are developers embracing this? So, the answer here will surprise you. Maybe not. I don’t know. But there are a lot of PWAs already out there, including Google Maps. Yes, this already works
in Edge on Android. You can pin it to your start screen and have a PWA of Google Maps
that uses your location and works just like the app itself. That means, in theory, yes, Project Andromeda will have Google Maps, which is really enticing. But, there are other ones out there. Starbucks has a preview version. If you go to preview.starbucks.com
on your phone, you can see it there and log in and pin that to your start screen
and that is a PWA, as well. You also have Twitter, you have Instagram, you have Tinder, you
have Uber, you have Lyft. You have a bunch of
services already out there, even Pinterest has a PWA. So, yes, all the major
companies are embracing this, because again, companies
hate paying developers. Sorry. They would rather just
have a web developer, basically make a PWA
website and call it a day. I also expect a lot of
banks to jump on this. Because maintaining a banking
app is super expensive. There’s a lot of security involved. There’s a lot of laws, in effect, that they need to be compliant with. That’s one reason why Windows10 always had an issue with banking apps. They’re very expensive to maintain. But, what is always maintained? A banking website. In fact, that gets updated even before any iOS and Android apps. So, if a bank can maintain a PWA website, well that’s a win-win for everybody, including them and their
consumers, and yes, eventually Windows10 users. Does Microsoft have any plans to release any of its apps in PWA form? And so that question’s a little confusing, and I’ll tell you why. A PWA has to be thought of
as, first, living on the Web. But, I can tell you of one
instance, as an example. outlook.com. So, outlook.com is both
an email service that’s on the Web, but, of course,
there are apps for it. Now, is Microsoft gonna take its app and convert it to PWA? No. What they did do though
was convert outlook.com into supporting PWA. So, again, launch your Android phone up, use Chrome, use Edge or go to outlook.com and now add that to your home screen and re-launch it and
you’re going to quickly see it looks just like an Outlook app. It’s very impressive. It is full PWA-compliant. So, Microsoft will take
any of their services, that live on the Web and
convert those to PWA. So, I imagine OneDrive is there, as well, and their other services. I haven’t tried ’em all, but, yes, Microsoft is definitely on board, here, with making its websites PWA-compliant. Does Microsoft Edge even support PWAs yet? Alright, so if you’re running Windows10 fall creators update, the answer is no, but don’t worry,
Redstone4, which is slated for Spring 2018 or actually,
in a couple of weeks, will be supporting PWA right out the door. That’s also when Microsoft
is going to start putting some of these PWA websites
into the store, as a test. As they get feedback, will roll out more, using that Bing Crawler. So, yeah, look for it very soon. Now, PWAs, I should
explain, is still very new. That’s why, for instance,
Starbucks has a preview of it and Twitter has Twitter Lite, so a lot of this stuff is
basically in development. Google, themselves, aren’t
really launching their PWAs until around mid-2018. So, look for this technology to ramp up. And don’t forget, it’s 1.0. So, for instance, the
Instagram app does a lot of cool stuff already. You can double-tap to like something. It has very good scrolling. But, it doesn’t do all
the things necessarily. You can access even the camera,
which is kind of unique. These things are very powerful, but they’re not necessarily
as powerful as app, but that will change as PWAs progress and improve over time. And, finally I know one question I know you will be hearing a lot about is will Windows Phone support Edge with PWAs? I don’t believe so. I don’t know what
Microsoft’s plans are here. I am doubtful that they
are going to actually update Edge on the phone to support PWAs, which is a bit of a
shame, but we don’t know. They could do it if they want to, but they really are kind of
done with Phone, at this time. Since PWAs are web apps,
do developers even need an app store taking a 30% cut? So, I touched upon this
a little bit earlier. If your website if free to
access; it’s outlook.com, it’s Uber, it’s Twitter,
it’s Lyft, LinkedIn, there is no cut, right? I mean if your app is free on the store, Microsoft’s not really taking a cut and I already described
earlier how Microsoft is gonna put these websites on
their store, automatically, without necessarily asking
those companies to do so, because all they’re doing is linking to that website, after all. So, there’s no changing of money here, which is why legally
they can even do this, so, what stores are really good for is what we all know is discoverability. The idea is you want to
open up say Windows10 for the first time, out of
your out of box experience, you wanna hit that store and be like, I want Uber or I want my banking app. You type it in and it
shows up, you hit install and it downloads. Sure, everybody knows you
can just launch the browser and do that, but this is going to be a containerized version of that. And, what’s really neat about
the PWA stuff in the store is technically the app
never needs to be updated, since it’s pulling down
live data from the store and it can live in a cache offline, all it depends on is that
website being updated. So, the consumer really
wins out here, as well, too. Finally, how long do you think
it will be until PWAs are the standard and not the exception? Making predictions about
new technologies is always difficult, especially standards and this is a 1.0 after
all, but I expect PWAs to check on pretty fast. Like I said, I already
listed to a bunch of major sites that already supporting it, and technically it hasn’t launched, yet. At least not in an official capacity. So, we are seeing a lot of uptake from developers with this. In fact, I get asked a
lot of questions from devs about this topic all the time. I do expect, going into 2019 you’re gonna see a lot of this. Now, what really matters is how the stores bascially adopt PWAs. So, we know Microsoft is
going full blast with it, and that’s going to be very
good for the technology. I’m not sure what Google’s
policy is gonna be here. I wouldn’t be surprised
if we hear more about a Google I/O coming up in May
and I wouldn’t be surprised if they decide to put PWAs
in their store, as well. Moreover, I can see Twitter or Instagram, for instance, basically
saying we’re going to put our PWAs in the
store and replace their current apps with it. In fact, Twitter just
announced that they’re deprecating their app for a Mac OS. Why is that? It’s PWA, folks. There is just no point
in Twitter making apps for all these platforms
and if you’ve used a Windows10 Twitter app you can probably see where this is going, as well. I can also imagine that
app being deprecated and replaced instead with Twitter PWA. I think this technology is
gonna come very quickly, and there’s one reason. It’s money. Companies just don’t want
to pay developers to make and maintain these applications. It’s also a platform-neutral system. It’s a win-win for
almost everyone involved, except maybe app developers
on iOS and Android. In fact, I think this will probably hurt Apple devs the most, because if PWA actually goes into the store for iOS, those devs get paid a lot of money and they’re in high demand and they won’t necessarily have as much work. Moreover, Apple would
lose a lot of revenue, potentially, as they don’t
necessarily get a cut of a lot of those apps, either. So, we’ll just have to wait
and see what happens there. But, yeah, expect PWA to
be a big deal in 2018. Alright, so I hope you enjoyed that deep dive into PWAs. If you have more questions, leave them in comments and
we’ll try to answer them. I’d like to thank Rance P. for submitting all those questions to me. It really helped me give
a structure to this talk. If you like this video,
give it a thumbs up and don’t forget to subscribe. Thanks for watching. Take care everybody.

Danny Hutson

100 thoughts on “All you need to know about PWA (Progressive Web Apps)

  1. I have high hopes for PWAs, but still have concerns.

    Do you think their will be concern with the open nature of PWA's? I'm excited about them, but often time content in a store has also been checked and approved, and I should trust it more than the wild west web (www). Will this not decrease how much I can trust apps in the store? It's a pain sometimes how tight app stores can be, but their tight for a reason…to ensure trust from their users.

    Also, I like that apps follow the design standards of the OS, but the web is a lot less structured which damages consistency and user experience.

    Again I still have high hopes. There is a demonstration of a Google developer making a light chat PWA app that opens faster than native stock apps on Android.

  2. So I believe eBay for Android is a PWA since it never shows up in my app list once I close it out and doesn't show up on my second screen(LG V20) as an app. It's super fast and doesn't appear to be anything more than a regular app. If Windows 10 adopted this on a wide scale and it worked as well as this I could definitely move back to Windows 10 on phones. Or maybe it's an instant app… Now I'm unsure about life. 🤔🤔😂

  3. Great explanation. PWAs are great for ALL PLATFORMS. Discoverabilty is the key. Helps all of us get the "apps" we want on all our platforms.

  4. So lets say snapchat who doesnt have a web app to begin with, do you think they would end up making a website instead with pwa, and remove their app from the app stores to avoid the app costs ???

  5. Every OS will need app stores only for games and extension support stuffs.. So it is a mandatory thing.. Btw this video is soo satisfying for a windows mobile user.. Thankyou Dan😌

  6. Q: will windows phone support edge with pwa?
    A: yes looks like it is supporting right now bcs i am using W10M and every pwa site is working awesome..
    such as..
    1.uber.
    2.twitter.
    3.instagram.
    And every other pwa site…

  7. My biggest hope for PWA, is for Microsoft to finally remove all the stupid bloatwares that come pre-installed in a fresh Windows 10 OS install.

  8. I hate pwa. We moved from web to apps we dont wana go back for a failed company. Service workers is going to be the new hub for viruses just like legacy code.

  9. Funnily enough I think this will hurt Android and IOS development. I expect native development to decline.

    I think Microsoft will benefit the most, since they will have Centennial (Win32), UWP and PWA.

  10. I build websites for a living; every single site I've built in the last year or so has supported PWA. It's the future of apps, really excited to see the technology continue to grow!

  11. Well the twitter PWA just lost me. It plain sux. I'll give it another shot later, but I kinda wanna learn more about it on desktop.

  12. Actually…although they aren't PWAs, a lot of sites are already using some form of Web Apps that work pretty good right now. I'm waiting for my new phone to arrive and I've been using my Lumia 1520 and BB Passport in the meantime. I just went thru the homescreens on my tablet and pinned the websites for the apps that I couldn't get. Most of them even create an icon and you would never know that they're not apps from a store. I did cheat and put the Google Play Store on the Passport because I couldn't get LastPass any other way. I'm pretty satisfied with the way everything is working. 
    Too bad MS & BB didn't do this sooner. It could have saved both of these operating systems. We've lost the two most secure OS forever now.

  13. I already have started using websites instead of apps for example uber or twitter as they perform excellent.Bright future ahead for PWA's.

  14. "developers always target iOS first"

    Maybe in the US. In Europe things are much more balanced, with Android sometimes getting new apps and features first.

    As for PWAs, I think they're definitely the future and I can see them replacing pretty much everything in the App Stores, with the exception of games and AR apps (at least for now).

  15. Daniel, this is incredible news. Thank you for sharing and what a great post. I've already tried out all of the apps you mentioned in this video – so cool.
    I did notice Edge on Android, that when I have a web app open and, on my phone, I hit the button which shows all apps or websites open at that moment, that those sites which are PWA it will say above the Edge browser, "Web App" and those sites which do not have PWA capability it will say the name of the app or website.

  16. Some questions about PWAs:
    Can PWAs be used on the X-box since there is an Edge app or will they show up in the store and be able to be downloaded from there? Can PWAs be used on IOT or Halo Lens?

    Will PWAs take up any space on a phone or mobile device since they are web-based?
    Often I have to delete apps to make room for other apps, will PWAs solve that issue?

    Will Microsoft still have a challenge of not having apps in the store which are not web-based, like a lot of games, say Angry Birds or similar apps? Won't there still be an "app gap" there?

    Is there any site where consumers can request that Microsoft add a website to the app store which can potentially be a PWA?

  17. My concern with PWA has always been and still is that you don't get any of the Store security and purchase support for it.

  18. Edge on Windows 10 Mobile supports a subset of PWA functionality. For example, Google Maps works OK – it gets your location from the GPS and allows you to search and drag the map around and get directions with your location as a moving blip running on the map. Only thing missing is turn-by-turn.

  19. I can see this being life support for Blackberry OS, Windows Phone, Sailfish OS, Ubuntu Phone, older devices, etc. As long as the browsers on these devices can support recent standards, you can realistically benefit from all of these PWA's. Even without the ability to pin the sites to your home screen, saving them as bookmarks should still allow this functionality I believe. And with the cost of maintaining apps, I wouldn't doubt a lot of developers are going to make the more cost effective jump. I also see this being beneficial to phones without much memory as you're not installing apps eating up memory. This just seems a win/win for everyone.

  20. I did hear that pwa was going to replace the chrome apps format this year . Only chome extensions no apps just pwa except for Chromebook they will still got the option . Don't know how that went

  21. The colors and lighting doesn't look good in the video. You might want to make your lighting better. Just a suggestion

  22. What made Windows Phone beautiful was its design language consistency with its bold and large typography. This PWAs are going to finally kill design languages in phone OSs.

  23. It's good that there is no separate app development required for different OS's but how this affect ram and performance of the device. Is this will improve the performance of the device or it will just work like a web browser with improved UI.

  24. Literally been doing PWA’s for iOS and Android for about six years. Appcache manifest powered.
    Dismal experience from the iOS side – don’t trust em to not leave you in the water whenever the next version of iOS comes out.

  25. This is amazing but if the Windows Phones doesn't support it that will be such dum thing but actually good step in the right direction

  26. the review is highly professional with deep analysis we dont see much of this quality on web! keep up the high bar

  27. I know I'm on a Windows Central video, but I really hope that Apple/iOS start to accept PWAs in the near future. Right now you have to include a bunch of "hacks" for things to operate like a true PWA, but iOS still doesn't support push notifications, service workers support are garbage, and you can't perform background tasks…

  28. The elephant in the room with regards to PWAs is browser performance. This brave new world homescreen-browser-apps reminds me alot of Hybrid apps, which were largely thrown out due to sub par performance. The browser DOM is slower than native UI. It seems disingenuous that this is being totally ignored in the PWA hype train.

  29. One important question: Developers were able to write an application and upload it FOR FREE* in the store, now the developer has to pay a domain and a host for it's website (pwa). Would it not be nice if google, apple and microsoft would host these pwa for free ?

  30. There is a most advanced PWA system thats was there even before the term itself appeared, BEFORE 2015! The Mobsted platform runs millions of accounts already, but for larger corps and is only now making rounds with general public – https://www.youtube.com/watch?v=d9pkgu-46Qo&t=3s

  31. great point about PWAs being tied to the google search ecosystem. That is after all their monopoly. I would like to see native apps flourish however just to threaten that monopoly.

  32. As a kid I had an "Internet" book from the How and Why series in the 90s which pretty much predicted the concept of Web-Apps with then mostly Java in mind. Interesting how they didn't really get a foothold 20 years from then after so many tries.

  33. Thank you for this clear and forward-thinking overview. Very helpful for us as we begin to transition from a maker of native apps to a maker of both native and PWAs.

  34. I've been having difficulties with the starbucks app on android. The PWA mentioned works great though. So thanks for that.

  35. fantastic presentation. Q: if you had to guess, how much would the instagram PWA cost to create, maintain, and what is the avg. cost to creating a PWA. – Cheers

  36. progress web apps are futur.. here is interesting read https://cwatch.comodo.com/blog/website-security/are-progressive-web-apps-the-future/?utm_source=youtube&utm_medium=referral&utm_campaign=topsecurity

  37. Windows phone is not dead. If you don't care about making standard phone calls, and are OK with internet based calls, then buy a small (7") windows tab and plug a data dongle if the tab is not LTE

  38. Great explanation on PWA's. How would an average user distinguish the PWA from the app on the homescreen? Would it simply be which one was added first would be the native app and the one added second would be the PWA?

  39. i have build a PWA for a website balijasevasanghaballari.org, the problem is I have embedded the youtube video when I start to play a video after 30 seconds the screen turns out as there was no video playing, in Mozilla it is working fine

  40. I have some dumb questions.
    1. what advantage it gives to the end users other than giving quick access to website just like launching an app? we could just book mark the web page in the browser and open it.
    2. Will there be a speed/performance difference compared to native apps.?
    3. is it similar to ice concept in peppermint?

  41. Great video! Insightful. I think one of the main benfits of PWA that is making companies like twitter and Instagram adoapt it, is the usage of data and how efficient it runs on slow internet networks.

  42. Very exciting stuff! What are your thoughts on making a PWA that uses a top level domain of .app? Do you think big companies like Starbucks would be interested in buying the Domain Starbucks.app to make it easy for the consumer to download their app if it's a PWA?

  43. Hi, anybody can help me . how to create a mobile web app on browsers like the mobile application. What's the technologies they are using .

  44. Think this video needs updation, considering tools like PWA2APK allows pwa to be uploaded on Google Playstore with ease.

  45. OneDrive App 19.21.82.0 will be PWA on Windows 10.
    And thank you for this very informative video…

  46. was this a joke… a thing called "bing crawler"? I love when non-technical people try to explain things…

Leave a Reply

Your email address will not be published. Required fields are marked *