$30 off During Our Annual Pro Sale. View Details »

Progressive Web Apps on Rails

Progressive Web Apps on Rails

Talking about "Why Progressive Web Apps?" and how you can start building them on Rails

Ross Kaffenberger

September 22, 2016
Tweet

More Decks by Ross Kaffenberger

Other Decks in Technology

Transcript

  1. Progressive Web
    Apps on Rails
    Ross Kaffenberger
    @rossta

    View Slide

  2. Native > Web
    Reliable
    Independent of connectivity
    Works offline
    Sync-able
    Installable
    Re-engageable

    View Slide

  3. Web > Native
    Responsive
    Write once, Run everywhere*
    Fresh
    Linkable
    Discoverable
    Fast first-visit

    View Slide

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

    View Slide

  5. View Slide

  6. View Slide

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

    View Slide

  8. Service Worker
    •Intercept requests
    •Access to cache, IndexedDB, etc.
    •Send push notifications
    •Sync with server in background

    View Slide

  9. Service Worker

    View Slide

  10. Service Worker

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

  14. Service Worker on Rails

    View Slide

  15. Service Worker on Rails Sandbox

    View Slide

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

    View Slide

  17. github.com/rossta/
    serviceworker-rails

    View Slide

  18. @rossta
    rossta.net
    Ross Kaffenberger

    View Slide