Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

5 minutes PWA

Avatar for Tatsuya Arai Tatsuya Arai
February 23, 2018
Technology
250
0

5 minutes PWA

Avatar for Tatsuya Arai

Tatsuya Arai

February 23, 2018

More Decks by Tatsuya Arai

See All by Tatsuya Arai
Androidアプリ開発における技術顧問としての役割 #DroidKaigi 2018
Avatar for Tatsuya Arai cutmail
1
2.5k
4年続くアプリにおけるチーム開発 #DroidKaigi 2017
Avatar for Tatsuya Arai cutmail
13
5.1k
フリルにおけるドッグフーディング / Fashion Tech Meetup #2 LT
Avatar for Tatsuya Arai cutmail
2
4k
Adapter and Custom Layout
Avatar for Tatsuya Arai cutmail
3
1k
いかにして不具合発見時の フィードバックを素早く行うか #potatotips 12
Avatar for Tatsuya Arai cutmail
0
2.7k
Androidのログ出力をいい感じにする #potatotips 9
Avatar for Tatsuya Arai cutmail
8
10k
コーディング規約を緩く守りつつ仕事の成果を出す方法
Avatar for Tatsuya Arai cutmail
2
680

Other Decks in Technology

See All in Technology
Benchmarking Disaggregated Serving on vLLM + Dynamo with a Real Coding-Agent Workload
Avatar for NTT docomo Business nttcom
1
190
AIにシークレットを見せない、WSL2で安全な開発環境
Avatar for yazm4 yazm
0
290
実体験から学ぶ分析エージェントの開発と運⽤
Avatar for Recruit recruitengineers
PRO
8
2.4k
スプシの手作業からの解脱 ~更新はClaude Codeに、見せ方と使い方はGASアプリに任せる~
Avatar for KentaroFujii kentarofujii
0
150
パスキーの自動テストはどこまでいけるのか
Avatar for teamLab teamlab
PRO
0
180
分析の民主化を支えるメタデータ整備の実践
Avatar for KAKEHASHI kakehashi
PRO
4
1.4k
サブエージェントと Claude Mods で作る独自 Advisor ツールの話
Avatar for Kenichi Odo kenichiodo
2
160
AIカンパニーへの転換を支えた、エンジニアの仕事の再定義
Avatar for KNOWLEDGE WORK / 株式会社ナレッジワーク kworkdev
PRO
2
1.2k
[JAWS-UG彩の国埼玉#12]そろそろ準備する？re:Invent2026をやさしく解説 / reinvent2026-sainokuni
Avatar for sh_fk2 sh_fk2
1
330
パッチ更新でterraform initが落ちた日
Avatar for gr1m0h grimoh
1
140
Post AI時代のリファクタリング実践記 / Refactoring in the post AI era
Avatar for 株式会社カミナシ kaminashi
1
230
How to Design Configuration for Rails Applications
Avatar for Shinichi Maeshima willnet
1
730

Featured

See All Featured
Design in an AI World
Avatar for tapps tapps
1
350
The SEO Collaboration Effect
Avatar for Kristina Bergwall kristinabergwall1
1
590
Agile Leadership in an Agile Organization
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
280
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
300
Google's AI Overviews - The New Search
Avatar for Barry Adams badams
0
1.6k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
133
20k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
203
77k
Designing Powerful Visuals for Engaging Learning
Avatar for Mike Taylor tmiket
1
600
My Coaching Mixtape
Avatar for mlcsv mlcsv
0
350
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
2
2.2k
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
96
14k
Believing is Seeing
Avatar for Spiro Bolos oripsolob
1
240

Transcript

  1. 5 minuts PWA

  2. PWAͱ͸ • Progressive Web Apps • ϞόΠϧ୺຤ͰϖʔδΛදࣔ͢Δͱ͖ʹωΠςΟϒΞϓϦͷ Α͏ͳڍಈΛͤ͞Δ͜ͱ͕Ͱ͖Δ • GoogleΛத৺ͱͯ͠ࡦఆ͞Ε͍ͯΔ

  3. PWAΛߏ੒͢Δཁૉ • Service Worker • Push API • Notification API

    • localStorage / IndexedDB • History API • Geolocation API

  4. PWAͰͰ͖Δ͜ͱ • ΦϑϥΠϯରԠ • ϖʔδͷදࣔ • ը໘ભҠ • ϓογϡ௨஌ •

    ϗʔϜը໘ͷ௥Ճ • Ґஔ৘ใͷऔಘ

  5. PWA vs Native

  6. None

  7. ࠾༻ྫ • Twitter Mobile • Instagram • ଞଟ਺

  8. Service Worker • ϒϥ΢β͕Webϖʔδͱ͸ผʹόοΫάϥ΢ϯυͰ࣮ߦ͢Δ εΫϦϓτɻ • DOMʹ͸௚઀ΞΫηεͰ͖ͳ͍ɻ • Service Worker͸࢖༻͍ͯ͠ͳ͍ؒ͸ऴྃ͞Εɺඞཁʹͳͬ

    ͨΒىಈ͠·͢ɻ • localhost or httpsͰͷΈಈ࡞ɻ

  9. Service Worker

  10. ϒϥ΢βରԠঢ়گ

  11. iOS11.3ΑΓService Worker͕༗ޮ ʹ

  12. ݁࿦

  13. ͙͢ಋೖ͢΂͖͔ʁ

  14. ·ͩૣ͍

  15. Ҏ্

  16. ࢀߟϦϯΫ • http://www.publickey1.jp/blog/18/ appleiosmacosprogressiveweb_apps.html • https://qiita.com/edwardkenfox/items/ 4c0b9550ffa48c1f0445 • https://qiita.com/y_fujieda/items/f9e765ac9d89ba241154 •

    https://developers.google.com/web/fundamentals/primers/ service-workers/?hl=ja • https://qiita.com/horo/items/ff665e4a6613e7684f8f