47
PWA e Hybrid App VS Native Alberto Abruzzo / GDG Milano www.albertoabruzzo.com @alberto_abruzzo

PWA e Hybrid App VS Native

Embed Size (px)

Citation preview

Page 2: PWA e Hybrid App VS Native

Cos’è una app Native?

Page 3: PWA e Hybrid App VS Native

Performance API User Experience

Pro Native

Page 4: PWA e Hybrid App VS Native

Costi alti Troppo tempo Grande impiego di risorse

Contro Native

Page 5: PWA e Hybrid App VS Native

Cos’è una app Hybrid?

Page 6: PWA e Hybrid App VS Native

Costi ridotti Sviluppo rapidoCode Sharing

Pro Hybrid

Page 7: PWA e Hybrid App VS Native

Performance non al top

User Experience Accesso limitato alle API

Contro Hybrid

Page 8: PWA e Hybrid App VS Native

Cos’è PWA?

Page 9: PWA e Hybrid App VS Native

Installazione Update Progressive

Pro PWA

Page 10: PWA e Hybrid App VS Native

Cross browser? iOS? I limiti del web

Contro PWA

Page 11: PWA e Hybrid App VS Native

whatwebcando.today

Page 12: PWA e Hybrid App VS Native

Come evolve il mercato

Page 13: PWA e Hybrid App VS Native

App presenti negli Store

Page 14: PWA e Hybrid App VS Native

Come sviluppare app hybrid

Page 15: PWA e Hybrid App VS Native

$ npm install -g cordova ionic$ ionic start myApp tabs$ ionic platform add android$ ionic run android

Page 16: PWA e Hybrid App VS Native
Page 17: PWA e Hybrid App VS Native

ionicframework.com/docs

Page 18: PWA e Hybrid App VS Native

$ npm install -g react-native-cli$ react-native init myApp$ react-native run-android

Page 19: PWA e Hybrid App VS Native
Page 20: PWA e Hybrid App VS Native

facebook.github.io/react-native/docs

Page 21: PWA e Hybrid App VS Native

Casi reali di app hybrid

Instagram

Page 22: PWA e Hybrid App VS Native

Casi reali di app hybrid

Sworkit

Page 23: PWA e Hybrid App VS Native

Casi reali di app hybrid

Material Apps Showcase

Page 24: PWA e Hybrid App VS Native

Qual è il problema?

Page 25: PWA e Hybrid App VS Native

Come rimediare?

Con le Progressive Web Apps (PWA)

Page 26: PWA e Hybrid App VS Native

App Shell 1

Service worker

Manifest

2

3

Page 27: PWA e Hybrid App VS Native

App Shell 1

Page 28: PWA e Hybrid App VS Native
Page 29: PWA e Hybrid App VS Native
Page 30: PWA e Hybrid App VS Native
Page 31: PWA e Hybrid App VS Native
Page 32: PWA e Hybrid App VS Native

App Shell 1

Service worker 2

Page 33: PWA e Hybrid App VS Native
Page 34: PWA e Hybrid App VS Native
Page 35: PWA e Hybrid App VS Native
Page 36: PWA e Hybrid App VS Native
Page 37: PWA e Hybrid App VS Native

App Shell 1

Service worker

Manifest

2

3

Page 38: PWA e Hybrid App VS Native

<head>

</head>

Page 39: PWA e Hybrid App VS Native
Page 40: PWA e Hybrid App VS Native
Page 41: PWA e Hybrid App VS Native
Page 42: PWA e Hybrid App VS Native
Page 43: PWA e Hybrid App VS Native
Page 44: PWA e Hybrid App VS Native

pwa.rocks

goo.gl/xrnV86

goo.gl/ziCGM0

Page 45: PWA e Hybrid App VS Native

Che tecnologia usare?

PWANative Hybrid

Page 46: PWA e Hybrid App VS Native

Feedback

https://goo.gl/HBXbiL