Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Taking the P out of PWA

1,815 views

Published on

Meh!

Published in: Education

Taking the P out of PWA

  1. 1. Taking the P out of PWA… Chris Heilmann (@codepo8) January 2018
  2. 2. Partner Application Experience
  3. 3. Apps in the Enterprise Photo by Janson G: pixabay.com/en/spaceship-model-isolated-enterprise-2749360/
  4. 4. Progressive Web Apps
  5. 5. twitter.com/larsklint/status/941504191222054912
  6. 6. twitter.com/codepo8/status/954311316113690624
  7. 7. “But, what is a PWA?”, I hear you ask. Yeah, OK, a developer can dream…
  8. 8. A PWA is Discoverable Installable Linkable Network Independent Safe Re-engageable Progressive Responsive App-Like Fresh
  9. 9. Asking that much is a bit of a stretch…
  10. 10. Let’s make this simpler… A PWA is a web-technology based application. It mixes the best of the web and the app space.
  11. 11. Let’s make this simpler… A PWA has a unique URL. This can be used as a distribution model. The link.
  12. 12. Let’s make this simpler… PWAs are progressive. They don’t work and behave the same everywhere.
  13. 13. Let’s make this simpler… PWAs are progressive. They improve over time and with the ability of the host environment.
  14. 14. Let’s make this simpler… If you choose to install PWAs they behave like we expect apps to behave. Without any of the annoying bits…
  15. 15. Bridging the gap between apps and web needed good technology
  16. 16. PWAs use the current web, progressively aka.ms/webcando
  17. 17. Additionally, we needed two new technologies.
  18. 18. Web Manifest
  19. 19. Service Workers
  20. 20. We talk far too much about the nuts and bolts.
  21. 21. E Engaging Let’s concentrate on how our apps appear to the user. F Fast I Integrated R Reliable
  22. 22. Where’s the fire? E Engaging F Fast I Integrated R Reliable
  23. 23. Where’s the fire? WTF? E Engaging F Fast I Integrated R Reliable
  24. 24. Let’s talk about things that need work…
  25. 25. Speed
  26. 26. E Engaging F Fast I Integrated R Reliable Empty shells are fast, but not useful... twitter.com/codepo8/status/954308397809184768
  27. 27. E Engaging F Fast I Integrated R Reliable PWAs should be faster, not slower...
  28. 28. Integration
  29. 29. E Engaging F Fast I Integrated R Reliable PWAs should play well with the OS…
  30. 30. E Engaging F Fast I Integrated R Reliable Alas, it is the web and user choice...
  31. 31. E Engaging F Fast I Integrated R Reliable We have some work to do...
  32. 32. E Engaging F Fast I Integrated R Reliable Great integration we don‘t mention...
  33. 33. E Engaging F Fast I Integrated R Reliable From web to app store via manifest...
  34. 34. E Engaging F Fast I Integrated R Reliable Yes, the manifest matters...
  35. 35. Reliability
  36. 36. E Engaging F Fast I Integrated R Reliable Embracing the web shareability...
  37. 37. E Engaging F Fast I Integrated R Reliable Avoiding known annoyances
  38. 38. E Engaging F Fast I Integrated R Reliable Availability in the worst scenarios...
  39. 39. E Engaging F Fast I Integrated R Reliable Let’s be mindful of Service Workers… homebrewery.naturalcrit.com/share/SyZ4Sxms5b
  40. 40. Engagement
  41. 41. E Engaging F Fast I Integrated R Reliable Engaging, not annoying…
  42. 42. E Engaging F Fast I Integrated R Reliable Not all re-use is advisable...
  43. 43. E Engaging F Fast I Integrated R Reliable Going too basic isn‘t helping either...
  44. 44. E Engaging F Fast I Integrated R Reliable Let’s build progressive interfaces…
  45. 45. E Engaging F Fast I Integrated R Reliable Same app, different environment…
  46. 46. This isn’t new - our web best practices apply… E Engaging F Fast I Integrated R Reliable
  47. 47. PWA tooling is great! (as always, it is tough to build tools for an open stack)
  48. 48. ServiceWorker Cookbook (Mozilla) aka.ms/serviceworkers
  49. 49. Workbox (Google) aka.ms/workbox
  50. 50. Lighthouse (Google) aka.ms/google-lighthouse
  51. 51. Not everybody cares about the nuts and bolts… twitter.com/headjs_ru/status/955333399564161024
  52. 52. PWA Builder (Microsoft) aka.ms/pwa-builder
  53. 53. PWA Builder (Microsoft) aka.ms/pwa-builder
  54. 54. Why is it hard to find great examples?
  55. 55. Why indeed?
  56. 56. Our PWA messaging is at times awful and short-sighted E Engaging F Fast I Integrated R Reliable
  57. 57. Moaning travels upwards and takes a long time to arrive. Photo by Janson G: pixabay.com/en/spaceship-model-isolated-enterprise-2749360/
  58. 58. It is tough to find PWAs on FIRE (that aren’t demos)
  59. 59. PWA Stats (Cloud Four) aka.ms/pwa-stats
  60. 60. Please help the PWA effort
  61. 61. Don’t assume your experience is normal E Engaging F Fast I Integrated R Reliable
  62. 62. Give feedback and take part in tools and docs E Engaging F Fast I Integrated R Reliable
  63. 63. Keep up-to-date before telling people about PWAs. E Engaging F Fast I Integrated R Reliable
  64. 64. Promote and celebrate great examples. E Engaging F Fast I Integrated R Reliable
  65. 65. I try to stop people to package awful websites into containers - again.
  66. 66. Please, help!
  67. 67. Thanks! Chris Heilmann @codepo8

×