Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
なぜ今PWAがきているのか トレンドの背景
Search
Hitoshi Sumiya
September 18, 2019
Technology
1.7k
4
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
なぜ今PWAがきているのか トレンドの背景
Hitoshi Sumiya
September 18, 2019
More Decks by Hitoshi Sumiya
See All by Hitoshi Sumiya
【メタバース研究開発支援】 VRChatワールド制作・イベント開催支援
hitoshi_sumiya
0
3.1k
Other Decks in Technology
See All in Technology
ループエンジニアリングでE2Eテストを実践
noriyukitakei
0
350
プロダクトだけじゃない、社内プロセスにおける自動化・省力化ノススメ
kakehashi
PRO
1
3.6k
型は壁、Rustでもバグを直すな、表現できなくせよ
nwiizo
13
2k
証券システムを10年Scalaで作り続けるということ - 関数型まつり2026
krrrr38
3
840
AI駆動開発におけるQAエンジニアの役割事例 〜AI駆動開発の現場から〜
kobayashiyorimitsu
0
490
穢れた技術選定について
watany
3
310
cccccc
moznion
0
1.9k
CIで使うClaude
iwatatomoya
0
240
Kaggleで成長するために意識したこと
prgckwb
2
310
AI時代の開発生産性は、個人技からチーム設計へ
moongift
PRO
2
170
地域 SRE コミュニティ最前線 / SRE NEXT 2026 Discussion Night Track C
muziyoshiz
0
210
ゴールデンパスは敷いただけでは道にならない ─ 企画部門のエンジニアが技術標準を事業価値に変えるまで
mhrtech
0
140
Featured
See All Featured
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
2k
The Limits of Empathy - UXLibs8
cassininazir
1
440
Faster Mobile Websites
deanohume
310
32k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
uxyall
0
340
30 Presentation Tips
portentint
PRO
1
350
Joys of Absence: A Defence of Solitary Play
codingconduct
1
410
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
auna
0
180
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.4k
The Mindset for Success: Future Career Progression
greggifford
PRO
0
410
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
330
Art, The Web, and Tiny UX
lynnandtonic
304
22k
Transcript
なぜ今PWAがきているのか トレンドの背景 TAM 角谷 仁
自己紹介 角谷 仁 すみやひとし @hitoshisum ・PWA Nightコミュニティ運営 ・プロジェクトマネージャ/ディレクター11年 ・父親歴1.5年 ・開発チーム30名のマネージャ
・デジタル戦略の立案、開発案件のPMなど ・趣味は釣り TAM プロデューサー
このセッションのゴール ・PWAをただしく理解すること ・PWAを身近に感じてみること
ちなみに今日来てる人? ・職種 ・PWAへの関わり度
PWAってなに?
https://mobile.twitter.com/ Twitter Lite https://www.instagram.com/ Instagram 触ってみよう!
身近なPWA
https://appsco.pe/
PWA、なんとなくはわかるけど なんと説明したらいいかよくわからない…
概念的すぎてよくわからない ややこしい説明例
「ネイティブアプリみたいな」は分かりやすいけど 実際のところPWAが何かがよくわからない ややこしい説明例
機能面で理解しようとすると、 「オフライン対応とプッシュ通知」だけがPWAとおもってしまう ややこしい説明例
技術面だけで理解しようとすると 「Service Worker」や「Manifest」をいれてれば PWAっておもっちゃう。 ややこしい説明例
本質は「よりよいウェブ体験」を作っていくこと。 みんなでいいウェブの世界を 作っていこうね~
こう説明するのがいいと思う。 PWA=(最新の環境に合わせた)先進的なWebアプリケーション Googleが提唱した概念で、 ・ネットワークに依存せず(Reliable) ・表示が早くて、アクションもスムーズで(Fast) ・プッシュ通知やホームボタンに追加できる(Engaging) というこれまでにない新しいUXを提供するWebアプリケーションを目指しています。
先進的ってどういうこと?
いままでもできたこと 最近できるようになってきたこと これからできるようになること ブラウザは絶えず進化している Service Worker/Web App Manifestが使えるように。 ・ブラウザプッシュ通知 ・ホームボタン追加の案内
・ブラウザでキャッシュのコントロールができるように。 … ブラウザのAPIが充実 ・Badging API、Payment Request API… よりネイティブ機能へのアクセスが充実していく ・cssでのリッチな表現 ・JSでつるつる動くサイト(SPA等) ・非同期でのデータ通信 … [ブラウザにできること]
Progressive=進歩的、先進的、段階的「よりよくしていこう」
思い出そう 「Progressive Enhancement」
2012年頃の話
https://codepen.io/matuzo/pen/Emddvx
よりよいWeb体験を作っていこう!
トレンドをつかもう
いまPWAが来てる感じって 2012年頃にレスポンシブがトレンドになった時とすごく良く似てる。
None
・ブラウザが進化したことで普及した点 ・クロスプラットフォーム対応の方法である点 ・Googleさんが推進している点 何が似てる?
iOSでプッシュ通知が できるようになったら… できること増えてきたら ブラウザが進化したことで普及した。
ブラウザはどんどん進化している ブラウザでよりネイティブに近い体験ができるようになっていってる。
クロスプラットフォーム対応の方法である点 iOS: Objective C, Xcode Android: Java, Eclipse Windows: C#,
Visual Studio
ネイティブあるある ・アプリを開発できる優秀なエンジニアが給料の高い会社に転職 ・ネイティブアプリを作ったけど、ダウンロード数が1000以下 ・低評価→ダウンロードされない ・最初だけでなくすべてがダブルコスト。ちょっとしたことで予算がなくなる ・2つあるがために、改善するサイクルが遅くなってしまう ・OSのバージョンアップに伴う対応 / 新しい画面サイズ対応 ・改修の度にいちいち審査が必要
MicrosoftもPWA押し。
Googleさんが推進している点
None
Googleフォト Google Map Go Google 検索
None
このPWA Nightでも・・・
こんなツールもでてきた。 https://www.glideapps.com/
僕はPWAはウェブに関わる人の未来と思ってます。 PWAは一過性のものではなく 大きなトレンドととらえて みんなで一緒に勉強していきましょう!