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
なぜ今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
Anthropic AIネイティブ・スタートアップ構築のプレイブック を理解する
nagatsu
0
220
20260528_生成AIを専属DSに_Howの次にすべきことを考える
doradora09
PRO
0
260
oracle-to-databricks-migration-with-llm-and-dbt
casek
1
380
Fabric-cicd によるAzure DevOps デプロイ
ryomaru0825
0
150
Java正規表現エンジン(NFA)の仕組みと パフォーマンスを維持するための最適化手法
takeuchi_132917
0
150
AI フレンドリーなエラー監視を TypeScript で実現する
shinyaigeek
2
190
JEP 522 Deep Dive - G1 GC同期コスト削減によるスループット向上を徹底検証&解説
tabatad
1
410
組織の中で自分を経営する技術
shoota
0
230
GitHub Copilot CLIでWebアクセシビリティを改善した話
tomokusaba
0
140
Platform engineering for developers, architects & the rest of us (AI agents)
danielbryantuk
0
150
JJUG CCC 2026 Spring AI時代の開発こそ標準化を武器に! ― 方式・プロセス・プラットフォームの標準化
s27watanabe
2
630
エンジニアは生成AIと どのように向き合うべきか? ことばの意味という観点から
verypluming
3
300
Featured
See All Featured
Practical Orchestrator
shlominoach
191
11k
Claude Code のすすめ
schroneko
67
220k
The SEO Collaboration Effect
kristinabergwall1
1
470
ラッコキーワード サービス紹介資料
rakko
1
3.5M
We Are The Robots
honzajavorek
0
230
Paper Plane
katiecoart
PRO
1
50k
Writing Fast Ruby
sferik
630
63k
Visualization
eitanlees
152
17k
The SEO identity crisis: Don't let AI make you average
varn
0
480
How Software Deployment tools have changed in the past 20 years
geshan
0
34k
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
2k
The Director’s Chair: Orchestrating AI for Truly Effective Learning
tmiket
1
180
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は一過性のものではなく 大きなトレンドととらえて みんなで一緒に勉強していきましょう!