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

5 minutes PWA

Tatsuya Arai
February 23, 2018
Technology
0
180

5 minutes PWA

Tatsuya Arai

February 23, 2018
Tweet

More Decks by Tatsuya Arai

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

Other Decks in Technology

See All in Technology
第3回Snowflake女子会_LT登壇資料（合成データ）_Taro_CCCMK
tarotaro0129
0
190
日本版とグローバル版のモバイルアプリ統合の開発の裏側と今後の展望
miichan
1
130
KubeCon NA 2024 Recap / Running WebAssembly (Wasm) Workloads Side-by-Side with Container Workloads
z63d
1
250
フロントエンド設計にモブ設計を導入してみた / 20241212_cloudsign_TechFrontMeetup
bengo4com
0
1.9k
新機能VPCリソースエンドポイント機能検証から得られた考察
duelist2020jp
0
220
成果を出しながら成長する、アウトプット駆動のキャッチアップ術 / Output-driven catch-up techniques to grow while producing results
aiandrox
0
320
Amazon Kendra GenAI Index 登場でどう変わる？ 評価から学ぶ最適なRAG構成
naoki_0531
0
110
終了の危機にあった15年続くWebサービスを全力で存続させる - phpcon2024
yositosi
12
11k
Snowflake女子会#3 Snowpipeの良さを5分で語るよ
lana2548
0
230
20241220_S3 tablesの使い方を検証してみた
handy
4
510
LINEヤフーのフロントエンド組織・体制の紹介【24年12月】
lycorp_recruit_jp
0
530
Opcodeを読んでいたら何故かphp-srcを読んでいた話
murashotaro
0
250

Featured

See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
789
250k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
[RailsConf 2023] Rails as a piece of cake
palkan
53
5k
Mobile First: as difficult as doing things right
swwweet
222
9k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
The Pragmatic Product Professional
lauravandoore
32
6.3k
Into the Great Unknown - MozCon
thekraken
33
1.5k
Become a Pro
speakerdeck
PRO
26
5k
Making Projects Easy
brettharned
116
5.9k
Designing on Purpose - Digital PM Summit 2013
jponch
116
7k
The Language of Interfaces
destraynor
154
24k

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