Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Service Workers and PouchDB Lightning Talk at BTVJS

Bradley Holt
September 06, 2017

Service Workers and PouchDB Lightning Talk at BTVJS

Bradley Holt

September 06, 2017
Tweet

More Decks by Bradley Holt

Other Decks in Programming

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