I gave a talk to one of our internal groups at Microsoft today on Progressive Web Apps, PWAs, and thought the notes would also be helpful for those of you interested.

I’ve recorded videos on Hosted Web Apps in the past, and they are equally useful, so I’d suggest taking a look at those first. Consider PWAs as Hosted Web Apps, but with the added benefit of a Service Worker, and all that it affords.

 

Resources

• https://docs.pwabuilder.com/
• Feb 6 – Welcoming PWAS to Edge & Win 10
• Dec 19 – Service Workers: Going beyond the page
• PWA builder
• Dave Voyles – Build a hosted web app in 5 min [VIDEO]

Key features / benefits

• Cross platform: Web, Windows 7-10, iOS, Android
• Progressive: Adding abilities based on what the web affords you
  • Ability to change and evolve over time as the web platform continues to grow
• Fast update cycles of the web
• Functionality of native installed apps
• Look at it as a way for web developers to be able to participate in the app ecosystem. However, do not see it as a replacement for the existing app ecosystem.

 

Progressive web apps:

• Best of both worlds.
  • Native experience & work offline
  • Web RTC, web cam, etc.

• Are PWAs supplanting UWP? Should I make one or the other?
  • PWA on Windows IS a UWP app
    • Store listing, API accesses
  • UWP is still useful for many cases
    • EX: Native code required, mixed reality
      • Although w/ asm.js & web assembly, native code can work in the browser in some cases

 

Is this specific to any vender?

• A set of technologies not tied to one specific vendor
• Progressive enhancement has been around for a long time.
  • Utilizing web standards
  • Essentially a better distribution capability

 

Service workers:

[2 min video on service workers]

Can I use them everywhere?

• What is a service worker?
• JS file run in the background, separate from your webpage, & handles events fired by the browser OR your webpage
  • Doesn’t need the webpage to be open & doesn’t show any markdown
• Fetch Events: intercept & respond to network requests, puts it between the network & browser
• Coming to Win 10 in RS4
• Storage (quota API) in the making
• Do not replace current storage mechanisms (Index DB)
• Way to name different caches and store different things in each cache

 

Making offline tech work in web tech

• App cache
  • Security
  • Not much control over what was cached
  • No feedback mechanism
    • EX: What is in the cache? How old is it? What needs to be new?

Scenarios:

• Offline functionality
• Push Notifications
• Asynchronous
  • Will not delay the starting of your app

 

Submitting through the store

• Right now, I just have the tokens and dev can email me if they want  one. – Jeff Burtoft
• In the next release of Windows 10, we intend to begin listing PWAs in the Microsoft Store.

 How did we get here?

• Microsoft has been at the forefront of web-based apps since Win 8
  • WWA – Windows Web Apps
  • Bundle up apps into an .apx
  • Expose Windows 8 APIs while levering web tech
  • Worked offline
• Bad parts:
  • Didn’t handle dynamic code at all
    • Hosted web apps came by to solve this

Considerations

• How should your website behave when there is no internet connection?
  • Even most APPS today require a connection (FB, Instagram, YouTube, Netflix, etc)
  • Consider having the bare essentials, and moving up from there (progressive)

 

 

 

 

-----------------------
@DaveVoyles

Subscribe to my startup, tech, and game dev newsletter