Service Workers and PouchDB Lightning Talk at BTVJS

Slide 1

Slide 1 text

Building Offline First Progressive Web Apps Bradley Holt, Developer Advocate Wednesday, September 6, 2017 Service Workers and PouchDB

Slide 2

Slide 2 text

organic growth by Steve Jurvetson, on Flickr (CC BY 2.0). The Web Platform

Slide 3

Slide 3 text

W3C HTML5 Logo (CC BY 3.0).

Slide 4

Slide 4 text

Evergreen by Basheer Tome, on Flickr (CC BY 2.0). Evergreen Browsers

Slide 5

Slide 5 text

mettalic weave by Joel Ormsby, on Flickr (CC BY 2.0). Polyfills

Slide 6

Slide 6 text

By Diseño Web Valencia, via Wikimedia Commons (CC BY-SA 4.0).

Slide 7

Slide 7 text

Web or Mobile App? iPhone 4 - Bottom View with Bumper by William Hook, on Flickr (CC BY-SA 2.0).

Slide 8

Slide 8 text

http://gph.is/2dhW35c

Slide 9

Slide 9 text

Progressive Web Apps (or how to have your cake and eat it too) German Chocolate Cake by Kimberly Vardeman, on Flickr (CC BY 2.0).

Slide 10

Slide 10 text

Progressive Web Apps A Progressive Web App provides both the discoverability of a web app and the reliable, fast, and engaging user experience of a native mobile app https://www.pokedex.org/

Slide 11

Slide 11 text

Offline First Progressive Web Apps must be Offline First in order to provide a reliable, fast, and engaging user experience regardless of network connectivity No Signal by Steve Hodgson, on Flickr (CC BY-SA 2.0).

Slide 12

Slide 12 text

speed 3 by Monkieyes, on Flickr (CC BY 2.0). Zero Latency Access to Content & Data

Slide 13

Slide 13 text

Offline, Online & ¯\_(ツ)_/¯

Slide 14

Slide 14 text

Cache content & assets with Service Workers Service Workers fetch diagram by Mozilla Contributors (CC-BY-SA 2.5).

Slide 15

Slide 15 text

Technological devices design created by D3images - Freepik.com | Texture 94 by Ellen van Deelen, on Flickr (CC BY 2.0). Sync is Hard

Slide 16

Slide 16 text

IBM Cloudant Apache CouchDB PouchDB

Slide 17

Slide 17 text

"CouchDB’s superpower is sync. Sometimes I even try to explain it to people by saying, 'CouchDB isn’t a database; it’s a sync engine.' It’s a way of efficiently transferring data from one place to another, while intelligently managing conflicts and revisions. It’s very similar to Git. When I make that analogy, the light bulb often goes off." –Nolan Lawson PouchDB & CouchDB: An interview with Nolan Lawson – CouchDB Blog

Slide 18

Slide 18 text

Apache CouchDB Devices by Darwin Laganzon, on Pixabay (CC0 Public Domain). | Cloud by Raphael Silva, on Pixabay (CC0 Public Domain). PouchDB Browser-to- Cloud Sync

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

Apache CouchDB Devices by Darwin Laganzon, on Pixabay (CC0 Public Domain). | Cloud by Raphael Silva, on Pixabay (CC0 Public Domain). PouchDB