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

Progressive Web Apps on Rails

Avatar for Ross Kaffenberger Ross Kaffenberger
September 22, 2016
Technology
0
2.3k

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
Tweet

More Decks by Ross Kaffenberger

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

Other Decks in Technology

See All in Technology
AIドリブンのソフトウェア開発 - うまいやり方とまずいやり方
Avatar for Riotaro OKADA okdt
PRO
9
550
開発と脆弱性と脆弱性診断についての話
Avatar for su3158 su3158
1
1.1k
GitHub Copilot coding agent を推したい / AIDD Nagoya #1
Avatar for tnir tnir
2
4.4k
フルカイテン株式会社 エンジニア向け採用資料
Avatar for FULL KAITEN fullkaiten
0
8.6k
AIが住民向けコンシェルジュに？ Amazon Connectと生成AIで実現する自治体AIエージェント！
Avatar for yuyeah yuyeah
0
260
Autonomous Database Serverless 技術詳細 / adb-s_technical_detail_jp
Avatar for oracle4engineer oracle4engineer
PRO
18
52k
いま、あらためて考えてみるアカウント管理 with IaC / Account management with IaC
Avatar for kohbis kohbis
2
680
知られざるprops命名の慣習 アクション編
Avatar for uhyo uhyo
10
2.3k
Yahoo!ニュースにおけるソフトウェア開発
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
300
サイボウズフロントエンドの横断活動から考える AI時代にできること
Avatar for mugi / Hajime Mugishima mugi_uno
4
1.4k
AWSの最新サービスでAIエージェント構築に楽しく入門しよう
Avatar for みのるん minorun365
PRO
11
610
Goでマークダウンの独自記法を実装する
Avatar for lag129 lag129
0
210

Featured

See All Featured
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
248
1.3M
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.5k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
46
7.6k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
183
54k
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
40
2k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
8
480
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
23
3.6k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
251
21k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
10
1k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
PRO
23
1.4k

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