PWA
https://gyazo.com/dc044b20a671226dc7fd20fb9c0060a7
Progressive Web Apps
参考
プログレッシブウェブアプリの紹介 - プログレッシブウェブアプリ (PWA) | MDN
概要、PWAの嬉しさなど
結局 PWA は来るの?来ないの?
2018年の記事
PWAは、貧弱なスマホやネットワークでも動く。ネイティブアプリはリソースを消費する
#WIP
ウェブアプリでありながらネイティブアプリのように使用できるようにする機能
AppleがiOSからPWAのサポートを削除したことを認める、デジタル市場法への対応で影響はEU圏のユーザーに限定 - GIGAZINE
AppleがiOS 17.4のベータ版でPWAのサポートを削除していることが明らかに - GIGAZINE
iOS 17.4からサポートされなくなる?
影響するのはEUだけらしい
「これを満たせばPWAである」のような厳密な定義がある感じでもないmrsekut.icon
ただし、こういうのを実装していればPWAと言えるよねのような基準はある ref
installできる
弱いnetwork、offlineでも使用できる
responsiveである
etc.
Lighthouseには、今N%ぐらいPWAになってるよと表示される
技術的には以下のようなものを使用する ref
HTTPS
ServiceWorker
Web App Manifest
https://web.dev/pwa-checklist/#core
Googleのchecklist
表示が高速
インストール可能
スプラッシュスクリーンもできる
ブラウザのURLのところとかが表示されない
offlineで機能する
push通知
web言語で作る
安定した速度は、ネットワークに依存しないことで確立する
ネイティブアプリのようなUIを実現できる
ブラウザデフォルトのUIを非表示にできるなど
ホーム画面のアイコンが設定できる
起動時のスプラッシュ画面が設定できる
#??
通常のwebと何が違う?
通常のdesktopアプリと何が違う?
e.g. Electron
スマホでなく、PC上でも嬉しい?
Web App Manifestってなに?
使用している例
Scrapbox
Twitter
Instagram
Workbox
ServiceWorkerをつかう
https://developers.google.com/codelabs/pwa-training/pwa03--going-offline?hl=ja#0
/daiiz/PWA Night Conf: ScrapboxでのServiceWorkerとCacheの活用
https://html5experts.jp/agektmr/20527/