Progressive Web Apps for mobile developers

Slide 1

Slide 1 text

Progressive Web Apps for mobile developers Enrique Garcia Navalon

Slide 2

Slide 2 text

Twitter: @garcianavalon [email protected] Lead Developer at SyncRTC/Mashme.io

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

How did the crappiest technology ever managed to beat the promised land of cross-platform desktop apps?

Slide 10

Slide 10 text

DISTRIBUTION The hardest problem in software and the biggest pain for users

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

No content

Slide 14

Slide 14 text

How did mobile platforms fight back? What is the difference between mobile apps and desktop apps?

Slide 15

Slide 15 text

CONNECTIVITY AND BATTERY They are both still shitty in 2017

Slide 16

Slide 16 text

PERFORMANCE Critical for many apps

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

“A Progressive Web App uses modern web capabilities to deliver an app-like user experience.” – Progressive Web Apps

Slide 22

Slide 22 text

3 ideas

Slide 23

Slide 23 text

Reliable - Load instantly, even in uncertain network conditions, and never show the “page not available offline”.

Slide 24

Slide 24 text

Fast - Respond quickly to user interactions with silky smooth animations and no janky scrolling.

Slide 25

Slide 25 text

Engaging - Feel like a natural app on the device, with an immersive user experience.

Slide 26

Slide 26 text

The good from the (good) apps ● Great performance ● Smooth animations ● Instant loading and offline support ● Tap-and-use from the homescreen

Slide 27

Slide 27 text

The good from the web ● Discoverability ● Distribution (just a URL, searchable) ● Cross-platform* ● Size

Slide 28

Slide 28 text

A PWA is ... ● A responsive web app, plus ○ Offline support ○ Push notifications ○ Add to homescreen

Slide 29

Slide 29 text

A PWA is not ... ● Hybrid app (Cordova packaged web). ○ It’s still a browser website.

Slide 30

Slide 30 text

Google magic! ● Dynamically creates an apk for your web ○ Kind of like Cordova packaging ● Required for ○ Notifications from app, not Chrome ○ App size during distribution (page load)

Slide 31

Slide 31 text

What’s the future for app developers?

Slide 32

Slide 32 text

Still a long way to go! ● PWAs are still in an early stage ● Apps are not dying anytime soon ○ Too much money in there ● iOS support is not there yet ○ Apple still has things to say ○ Swift apps running in Safari, maybe? ● IoT and “gadgets” are JS-safe for now

Slide 33

Slide 33 text

The developer journey never ends ● Don’t sit on your ass, keep learning ● Focus on core knowledge like patterns, architecture, data flows, algorithms, quality ● ~70*% of web developers are as far from PWA technologies as a mobile developer ● Find a way to have “data” written in your resume *Totally invented by me based on my limited view of my direct surro

Slide 34

Slide 34 text

Q&A Thanks!