Service Workers and PouchDB Lightning Talk at BTVJS

Transcript

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

   View Slide

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

   View Slide

3. W3C HTML5 Logo (CC BY 3.0).
   

   View Slide

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

   View Slide

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

   View Slide

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

   View Slide

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

   View Slide

8. http://gph.is/2dhW35c
   

   View Slide

9. 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).
   

   View Slide

10. 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/
    

    View Slide

11. 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).
    

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

16. IBM Cloudant
    Apache CouchDB
    PouchDB
    

    View Slide

17. "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
    

    View Slide

18. 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
    

    View Slide

19. View Slide

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

    View Slide

21. View Slide

22. Questions?
    

    View Slide