Progressive Web Apps on Rails

Slide 1

Slide 1 text

Progressive Web Apps on Rails Ross Kaffenberger @rossta

Slide 2

Slide 2 text

Native > Web Reliable Independent of connectivity Works oﬄine Sync-able Installable Re-engageable

Slide 3

Slide 3 text

Web > Native Responsive Write once, Run everywhere* Fresh Linkable Discoverable Fast ﬁrst-visit

Slide 4

Slide 4 text

Best of both worlds (on the web) Progressive Web Apps

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

Service Worker •Event driven •Worker context •No DOM access

Slide 8

Slide 8 text

Service Worker •Intercept requests •Access to cache, IndexedDB, etc. •Send push notiﬁcations •Sync with server in background

Slide 9

Slide 9 text

Service Worker

Slide 10

Slide 10 text

Service Worker

Slide 11

Slide 11 text

Service Worker •HTTPS only •Scoped by URL, e.g. /serviceworker.js /admin/serviceworker.js

Slide 12

Slide 12 text

Service Worker on Rails Problem: Making Service Worker scripts work with the asset pipeline GET /serviceworker.js

Slide 13

Slide 13 text

Service Worker on Rails gem “serviceworker-rails” •Serves pipeline assets from canonical urls •Customizes response headers

Slide 14

Slide 14 text

Service Worker on Rails

Slide 15

Slide 15 text

Service Worker on Rails Sandbox

Slide 16

Slide 16 text

github.com/hemanth/ awesome-pwa github.com/TalAter/ awesome-service-workers

Slide 17

Slide 17 text

github.com/rossta/ serviceworker-rails

Slide 18

Slide 18 text

@rossta rossta.net Ross Kaffenberger