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

Progressive Web Apps on Rails

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Ross Kaffenberger Ross Kaffenberger
September 22, 2016
Technology
2.3k
0

Progressive Web Apps on Rails

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

Avatar for Ross Kaffenberger

Ross Kaffenberger

September 22, 2016

More Decks by Ross Kaffenberger

See All by Ross Kaffenberger
Getting Lazy with Vue and PDFs
Avatar for Ross Kaffenberger rossta
2
1.5k
A Webpack Survival Guide for Rails Developers
Avatar for Ross Kaffenberger rossta
1
2.7k
What I look for in a Junior Developer
Avatar for Ross Kaffenberger rossta
2
1.1k
Enumerable's Ugly Cousin - GORUCO Microtalk
Avatar for Ross Kaffenberger rossta
0
440
Enumerator - Enumerable's Ugly Cousin
Avatar for Ross Kaffenberger rossta
1
570
Recurring Events with Montrose
Avatar for Ross Kaffenberger rossta
3
2.1k
Enumerable - How I Fell in Love with Ruby
Avatar for Ross Kaffenberger rossta
20
4.8k
Create and Deploy an Ember App in 5 Minutes
Avatar for Ross Kaffenberger rossta
7
3.8k

Other Decks in Technology

See All in Technology
ボトムアップの改善の火を灯し続けろ！〜支援現場で学んだ、消えないための3つの打ち手〜 / 20260509 Kazuki Mori
Avatar for SHIFT EVOLVE shift_evolve
PRO
2
700
Gaussian Splattingの実用化 - 映像制作への展開
Avatar for GPU UNITE gpuunite_official
0
180
100マイクロサービスのTerraform/Kubernetes管理地獄から抜け出すためのAI活用術
Avatar for Masaki Ishigaki markie1009
0
150
全社統制を維持しながら現場負担をどう減らすか〜プラットフォームチームとセキュリティチームで進めたSecurity Hub活用によるAWS統制の見直し〜/secjaws-security-hub-custom-insights
Avatar for みずほリサーチ&テクノロジーズ株式会社 先端技術研究部 mhrtech
1
440
ワールドカフェ再び、そしてゴール・ルール・ロール・ツール / World Café Revisited, and the Goals-Rules-Roles-Tools
Avatar for Kenji Saito ks91
PRO
0
150
Shiny New Tools Won't Fix Your Problem
Avatar for Trisha Gee trishagee
1
120
CyberAgent YJC Connect
Avatar for shimayuu shimaf4979
1
180
"うちにはまだ早い"は本当？ ─ 小さく始めるPlatform Engineering入門
Avatar for Haruka Sakihara harukasakihara
6
530
要件定義の精度を高めるための型と生成AIの活用 / Using Types and Generative AI to Improve the Accuracy of Requirements Definition
Avatar for haru860 haru860
0
320
Sociotechnical Architecture Reviews: Understanding Teams, not just Artefacts
Avatar for Eberhard Wolff ewolff
1
170
Claude Codeウェビナー資料 - AWSの最新機能をClaude Codeで高速に検証する
Avatar for ONOYAMA Shodai oshanqq
0
380
Swift Sequence の便利 API 再発見
Avatar for treastrain / Tanaka Ryoga treastrain
1
270

Featured

See All Featured
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
Avatar for Tech SEO Connect techseoconnect
PRO
0
180
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
Avatar for Sara Fernández Carmona sarafernandez
0
180
Lightning Talk: Beautiful Slides for Beginners
Avatar for Ines Montani inesmontani
PRO
1
540
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
54k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9.3k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
3k
We Are The Robots
Avatar for Honza Javorek honzajavorek
0
230
The Spectacular Lies of Maps
Avatar for Per Axbom axbom
PRO
1
740
What the history of the web can teach us about the future of AI
Avatar for Ines Montani inesmontani
PRO
1
550
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
128
55k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.4k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.6k

Transcript

  1. Progressive Web Apps on Rails Ross Kaffenberger @rossta

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

    Installable Re-engageable

  3. Web > Native Responsive Write once, Run everywhere* Fresh Linkable

    Discoverable Fast first-visit

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

  5. None
  6. None

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

  8. Service Worker •Intercept requests •Access to cache, IndexedDB, etc. •Send

    push notifications •Sync with server in background

  9. Service Worker

  10. Service Worker

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

  12. Service Worker on Rails Problem: Making Service Worker scripts work

    with the asset pipeline GET /serviceworker.js

  13. Service Worker on Rails gem “serviceworker-rails” •Serves pipeline assets from

    canonical urls •Customizes response headers

  14. Service Worker on Rails

  15. Service Worker on Rails Sandbox

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

  17. github.com/rossta/ serviceworker-rails

  18. @rossta rossta.net Ross Kaffenberger