I'll try and explain PWAs as I understand them. I'm not a developer, so bear with me if you are and I seem to be dumbing things down too much. You can have your say in the comments!
- the extension of the basic HTML tags to include multimedia and other embeddable elements
- the idea of an 'Application Cache' - this allowed web sites to store significant amounts of data offline. Far more than simple 'cookies' would allow
- push notifications (you'll have seen these when web sites offer to send these to you and you have to keep hitting 'Block'!)
Put CSS and HTML5 tags together and, as you'll have seen, even on a small phone screen, you can have a pretty decent, almost 'app-like' experience on a site, with navigation menus, videos, and much more, and with much of the processing handled locally and some of the resources needed (temporarily) stored on the phone/tablet/laptop.
Fast forward to 2018 and 'the year of PWA'. Effectively, this is the next logical step along the same lines and takes advantage of the power of modern browsers (yes, even Edge under Windows 10 Mobile), which offer 'service workers' (which can grab resources in parallel to the main process/UI), 'web app manifests', along with better support for push notifications, and more offline support.
So, when you visit a web site and it's implemented as a PWA (see below for examples), there's a short pause while the application's initial 'code' is downloaded and then you're, step by step, into an app-like experience which is more local/offline than online.
I realise that this is definitely generalising and dumbing things down too much, but to give you a flavour for the spectrum of applications and services:
|Processing on the phone (faster)
|Processing on the web server (slower)
|Dumb web page (HTML/JS/CSS)
|90% (and competing for resource downloads with other real time users of the site)
|30% (as above, plus local storage management, media servers, graphical UI)
|70% (plenty still being served up in real time)
|Progressive Web App (PWA)
|60% (as above, plus all the code and resources are temporarily stored and interpreted locally, with the online components only what has to be on the server)
|40% (more things the PWA needs are now local than online)
Sorry, techies, the table above is appallingly generalised, but readers will hopefully get the idea. PWAs are usually more offline than online, in terms of what's actually being processed on the device and after the initial small 'download' of the PWA's starting code. As particular chunks of additional code are needed, they get grabbed on demand - hence the 'Progressive' part of the name - but once these are local then they stay local too. The example PWAs below will hopefully illustrate all this, especially once you try them for yourself in Edge under Windows 10 Mobile.
PWAs are ideal for Internet-centric content, giving the feel and speed of a local native application yet with the vital information/news/content itself bang up to date, and all with minimal server-side processing needed. So online banking and shopping would be ideal opportunities for PWAs, for example, which is good because these are the two biggest 'gaps' in the Windows 10 app catalogue.
(Note that there are many things that a PWA inside the Edge browser can't do, including accessing PIM data, handling voice or text telephony, accessing device sensors, and so on. So PWAs will never take over completely from 'native'/UWP applications.)
On to the examples, then. Try these for yourself on your phone running Windows 10 Mobile and Edge and see what you think. Comments welcome!
As you'll have spotted above, just because Edge handles PWAs well under Windows 10 Mobile doesn't mean that the system is perfect. On other platforms (e.g. Android), the PWA 'app' can work full-screen, but as Zac mentioned on this week's podcast, Edge doesn't allow this - so you have to live with the URL bar being shown all the time.
But it's a minor thing in the grand scheme of things. And, through 2018 and beyond, as web sites and services start being replaced by Progressive Web Applications (as Twitter has done), then they'll get more (not less) accessible under your favourite mobile OS.