■PWA
https://digital-marketing.jp/seo/what-is-progressive-web-apps/
https://developers.google.com/web/fundamentals/architecture/app-shell?hl=ja
https://qiita.com/kimamula/items/4e25b8d2caca314f9dd2
Service Worker, App Shell Model, PRPL Petternなどを駆使したGoogleが提唱するProgressive Web Apps
HTML / JS / CSS だけでほぼ構成、モバイルApp的なWebが提供できる
SW(JS)がブラウザとサーバの間に位置し、データを取ったり渡したりブラウザの影/裏側で動く、サーバと考えてしまうと分かり易い？
App Shell Modelで側（画面テンプレート）をプッシュしておくと早い（JSレスポンス悪すぎるからコレってな)

PRPLは以下の略
　Push: 最初のURLルートに不可欠なリソースを Pushする。
　Render: 最初のルートを Renderする。
　Pre-cache: 残りのルートをPre-cache（事前キャッシュ）する。
　Lazy-load: オンデマンドで残りのルートをLazy-load（遅延読み込み）する。
/// Service Worker
訪問がない状態でのバックグラウンド同期、プッシュメッセージ
データの更新を集中的に受信して複数ページがデータの一部を利用
https://developer.mozilla.org/ja/docs/Web/API/Service_Worker_API
https://qiita.com/kei4eva4/items/fa5f99211e45b7ca6f6e

Webページとは別にバックグランドで実行するスクリプト
ブラウザでキャッシュ操作ができる、容量もあり強力、データ期限や破棄に注意
　DOMに直接アクセスできない
　ブラウザを開いていなくても動作可能
　プログラム可能なネットワークプロキシとして動作可能
　HTTPS必須（またはlocalhost）
ネットワークに依存しない、早い（阿部寛はもっと早い）、プッシュ通信、ホームに追加
　
/// プッシュ配信
https://liskul.com/push-notification-25520
https://www.fenrir-inc.com/jp/boltzengine/
https://pushnate.com/labs/pushnate/webpush-case-guide

事前のコンセントがなくいきなり「プッシュ通知を有効にしますか」と出てくるのは駄目
ユーザーに何の通知をするかを知らせたい
通知から訪れたときの表示と挙動を決めておく
セグメントを分けて送りたい場合はセグメントの情報をどうやってブラウザからたどってくるか
スマホではアプリのインストールが必要だが、Webプッシュはブラウザさえあれば通知ができる
https://webtan.impress.co.jp/e/2018/12/06/31214
通知の許可のダイアログを出す前にダイアログで説明
https://push.appirits.com/webpush/

過去評価の高かったボケが、1日1つプッシュ通知で配信
１日１回、時間帯としては「20時前後」に4回に分けて（通常19:50、20:00、20:10、20:20）配信
年末年始やGWだけは、昼と夜に（1日2回）
DAUに15〜20％くらい影響がでます。「プッシュしないとアプリを開かない人」が一定数いる
アクティブ度、アプリのバージョン、端末のOS、属性（男女）などで、セグメント配信
休眠ユーザーだけにプッシュ1万人に1人くらい（0.01％）しか起動せず難しい
https://appmarketinglabo.net/bokete-push/

配信方法は現在ではChromはGCMを、FirefoxはSimplePushサーバを利用←他の方法も調査中
　受信する端末ごとに異なるメッセージを送るにはGoogle Firebaseが使われる様である
　https://android.googleapis.com/gcm/send　https://updates.push.services.mozilla.com/push/
その許可を得たプッシュのエンドポイントを使用し配信
GCMの場合1度の送信で1000デバイスまで同時に指定できる、FirefoxのSimplePushでは1デバイスでの送信
デスクトップ/Webの場合はデスクトップに通知される（Win10の場合？Win7でも通知が来る）
https://qiita.com/zaru/items/f6e821052abb1b18bb0b
https://techblog.asahi-net.co.jp/entry/2018/09/28/173705

/// 結局
キャッシュを弄くってオフラインでもゴニョゴニョできる、先読みも可、プッシュ通知も可、モバイルAppぽく
　→G suiteのOfficeアプリがオフラインでもサクサク、メール受信通知もできるGoogleのG suite用みたいなもんか
　→PCよりスマホを売りたい、通信量でも儲けたいｆｂｇｃｐ、個人情報を取りたいので、モバイル優先、モバイルっぽくWeb、これはi-modeやね

UR evil.

■どのようにPWA化するのか
https://techblog.asahi-net.co.jp/entry/2018/07/06/145931
https://techblog.asahi-net.co.jp/entry/2018/08/10/175407
　1)Service Worker(PWAで必要な処理を記述するJavaScriptファイル)
　2)Manifest(PWAの仕様について記述するJSONファイル)
　3)アイコン…ショートカットアイコン、プッシュ通知時のアイコンや起動画面で配置する画像

navigator.serviceWorker.register('/servicew.js').then　JSファイルを登録（中に下記を入れ込む）
　//キャッシュ動作部分
　├addEventListener('install'　キャッシュのインストール
　├addEventListener('activate' アクティベート
　└addEventListener('fetch'　オフラインでもアクセスの際にクライアントが呼んでキャッシュ取得
　//通知部分
　├addEventListener('push で通知を受ける
　└addEventListener("notificationclick　で通知クリック時の挙動
Notification.requestPermission(function(status) {　通知許可は登録JS外でOK

キャッシュはリンク先も保持するようであるが、、、？
ブラウザのURLの鍵アイコンをクリックすると通知許可を含めて設定ができる（デフォルトの確認、許可、ブロック）
　デフォルトとブロックの時は「Push通知On」のボタンを表示　→　ボタンを押すとダイアログで何が通知されるか表示しOKボタンを押せる
　許可状態のときは「Push通知Off」のアイコンを表示
　キャッシュ優先のsw.jsだと更新ボタンでもキャッシュのまま、Cookieの中のサービスワーカーを削除

Service Workerキャッシュ戦略＞保存日はLocalstrageに置き、HTMLの有効期限は1日にする
https://qiita.com/tiwu_official/items/47e8a7c3e6f2d57816d7

https://techblog.asahi-net.co.jp/entry/2018/09/28/173705
受信する端末ごとに異なるメッセージを送るにはGoogle Firebaseが使われる様である

　トークンを発行し端末とトークンを紐付け配信サーバに記録
　配信サーバでメッセージを作り、個別トークンに対しメッセージ通知
　　JSONを送るがトークンを持っているもののみ通知が発火？

Notifications APIを見てみよう
https://developer.mozilla.org/ja/docs/WebAPI/Using_Web_Notifications
https://developer.mozilla.org/ja/docs/Web/API/Push_API
https://developer.mozilla.org/ja/docs/Web/API/ServiceWorkerRegistration/pushManager

通知自体はServiceWorkerが不要、下記2ステップでOK
　Notification.requestPermission(function(status) {　許可を取り
　var n = new Notification(theTitle,options);　通知を送る

カレンダーをサブカレンダー(o)化しPWAでオフライン対応（機内モード）
　キャッシュするよう指定しても全部一気にはオフライン化はしないようだ
　　一度オフライン時にアクセスしエラーが出た上、ネットワークが回復すると自動にキャッシュされる
　　　エラーを出さずに一度通常表示をするだけではキャッシュされなかった
　　　アンドオイドでは通知も来る(1:準備ができるとChromeでページが読み込まれます→2:ページを表示できます)
　　→スマホではDLに時間が掛かっていただけかも
　ServiceWorker内ではLocalStorageはセキュリティを理由らしいが使えない
　　IndexedDBは使えるらしいが、、、→使えんかった、よく分らん
　SWをインスコしたディレクトリへのアクセスでSWが動く？、SWJSへのアクセスではないか
　PHPでJSを吐いてもOK　js_serviceworker.phpとかでheaderをJavascriptとして

/// mmm
キャッシュが強い（指定以外もキャッシュ、手動でCookie/Serviceworker削除）
　どの範囲をキャッシュするか、キャッシュページの案内方法(お気に入りに入れる？)
サイトページを開いてなくても通知を出すのはServiceworkerいるので要調査(Firebase以外でやりたい)