1.
Taking the P out of PWA…
Chris Heilmann (@codepo8) January 2018

2.
Partner
Application
Experience

3.
Apps in the
Enterprise
Photo by Janson G: pixabay.com/en/spaceship-model-isolated-enterprise-2749360/

4.
Progressive Web Apps

5.
twitter.com/larsklint/status/941504191222054912

6.
twitter.com/codepo8/status/954311316113690624

7.
“But, what is a PWA?”,
I hear you ask.
Yeah, OK, a developer can dream…

8.
A PWA is
Discoverable Installable Linkable
Network
Independent
Safe Re-engageable
Progressive Responsive App-Like Fresh

9.
Asking that much is a bit
of a stretch…

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.
Let’s make this simpler…
A PWA has a unique URL. This
can be used as a distribution
model. The link.

12.
Let’s make this simpler…
PWAs are progressive.
They don’t work and behave
the same everywhere.

13.
Let’s make this simpler…
PWAs are progressive.
They improve over time and
with the ability of the host
environment.

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.
Bridging the gap between
apps and web needed
good technology

16.
PWAs use the
current web,
progressively
aka.ms/webcando

17.
Additionally, we needed
two new technologies.

18.
Web
Manifest

19.
Service
Workers

20.
We talk far too much
about the nuts and bolts.

21.
E
Engaging
Let’s concentrate on
how our apps appear
to the user.
F
Fast
I
Integrated
R
Reliable

22.
Where’s the fire?
E
Engaging
F
Fast
I
Integrated
R
Reliable

23.
Where’s the fire?
WTF?
E
Engaging
F
Fast
I
Integrated
R
Reliable

24.
Let’s talk about things
that need work…

25.
Speed

26.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Empty shells are fast, but not useful...
twitter.com/codepo8/status/954308397809184768

27.
E
Engaging
F
Fast
I
Integrated
R
Reliable
PWAs should be faster, not slower...

28.
Integration

29.
E
Engaging
F
Fast
I
Integrated
R
Reliable
PWAs should play well with the OS…

30.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Alas, it is the web and user choice...

31.
E
Engaging
F
Fast
I
Integrated
R
Reliable
We have some work to do...

32.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Great integration we don‘t mention...

33.
E
Engaging
F
Fast
I
Integrated
R
Reliable
From web to app store via manifest...

34.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Yes, the manifest matters...

35.
Reliability

36.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Embracing the web shareability...

37.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Avoiding known annoyances

38.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Availability in the worst scenarios...

39.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Let’s be mindful of Service Workers…
homebrewery.naturalcrit.com/share/SyZ4Sxms5b

40.
Engagement

41.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Engaging, not annoying…

42.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Not all re-use is advisable...

43.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Going too basic isn‘t helping either...

44.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Let’s build progressive interfaces…

45.
E
Engaging
F
Fast
I
Integrated
R
Reliable
Same app, different environment…

46.
This isn’t new - our web
best practices apply…
E
Engaging
F
Fast
I
Integrated
R
Reliable

47.
PWA tooling is great!
(as always, it is tough to build tools for an open stack)

48.
ServiceWorker
Cookbook
(Mozilla)
aka.ms/serviceworkers

49.
Workbox
(Google)
aka.ms/workbox

50.
Lighthouse
(Google)
aka.ms/google-lighthouse

51.
Not everybody
cares about the nuts
and bolts…
twitter.com/headjs_ru/status/955333399564161024

52.
PWA Builder
(Microsoft)
aka.ms/pwa-builder

53.
PWA Builder
(Microsoft)
aka.ms/pwa-builder

54.
Why is it hard to
find great examples?

55.
Why indeed?

56.
Our PWA messaging is
at times awful and
short-sighted
E
Engaging
F
Fast
I
Integrated
R
Reliable

57.
Moaning travels
upwards and takes a
long time to arrive.
Photo by Janson G: pixabay.com/en/spaceship-model-isolated-enterprise-2749360/

58.
It is tough to find
PWAs on FIRE
(that aren’t demos)

59.
PWA Stats
(Cloud Four)
aka.ms/pwa-stats

60.
Please help the PWA effort

61.
Don’t assume your
experience is normal
E
Engaging
F
Fast
I
Integrated
R
Reliable

62.
Give feedback and take
part in tools and docs
E
Engaging
F
Fast
I
Integrated
R
Reliable

63.
Keep up-to-date before
telling people about PWAs.
E
Engaging
F
Fast
I
Integrated
R
Reliable

64.
Promote and celebrate
great examples.
E
Engaging
F
Fast
I
Integrated
R
Reliable

65.
I try to stop people to
package awful websites
into containers - again.

66.
Please, help!

67.
Thanks!
Chris Heilmann
@codepo8