先日(2019/5/15)、PWA Nightに参加してきたので、レポートします。

はじめに

先日、技術書典に参加したのですが、その際 実践PWA というこのPWA Nightを主催されている方々の本を購入しまして、それをきっかけにPWA Nightの存在を知りました。

少し遅れての参加となったので、最初のコミュニティの説明と自己紹介には間に合いませんでした。トークセッションからの参加となります。

こえのブログのPWAについて @herablogさん

AmebaのこえのブログにおけるPWAの活用事例でした。

できるだけCDNを使う、キャッシュをどうするか、TTLの話やプリキャッシュやランタイムキャッシュの処理の流れなど、非常に詳しい内容で学ぶことが多かったです。また、WEB Share APIやVibration APIの利用についての話もありました。

一番印象的だったのは、録音中の音声の圧縮にWeb Assenblyを使ってることです。録音した音声をWasmを使ってMP3に変換し、blobで扱っているそうです。すごい。。

また、こえのブログについての詳細は以下に詳しくまとまっているとのこと。

https://developers.cyberagent.co.jp/blog/archives/20506/

やっていこう。PWA @oliver_diaryさん

@oliver_diaryさんの話です。PWAが始まってからの3年半の各種ブラウザやOSの対応状況の変化、PWAをやる際に考えるべきことやPWA関連技術についての話がありました。

通知をいかにして許可してもらうか。これはほんと難しいところです(私自身もアプリの通知もだいたいOFFにしちゃます)。

関連技術で述べられていた中でも、Workbox(Google 製のサポートライブラリ。キャッシュ周りの管理に便利)とOneSignal(Push通知の利用)はこの後のLTでも度々出ていたので、PWAを行う上では試しておきたいです。

また、今月行われたGoogle I/Oで発表された今後実装予定のWEB APIについても触れていました。アプリアイコンバッジのAPIやファイル共有APIが出てくるようです。

業務システムでこそPWA @goofmintさん

MOONGIFTの @goofmint さんの発表。よくMOONGIFT読ませて頂いています。今回は業務システムでのPWA活用についての話でした。

PWAはあくまでWEBアプリをネイティブライクにしていく技術の総称であり、無理に全部を盛り込まなくても段階的に取り込んでいけばいいよ、というありがたいお言葉がありました。

PWAは業務システムで活用すれば、利用者が限定され、UIもアプリほど高度である必要もないため、PWAに向いている。確かに。開発過程での顧客とのモック確認に使うとかも良いようです。

LT: PWACompatを本番導入してみた話 @gatchan0807さん

PWACompatの話。iOSだとmanifest.jsonが効かず、Androidと二重定義になってしまう問題があるが、このPWACompatを使うとmanifest.jsonの情報から対応していないブラウザ用の代替メタタグを挿入してくれるとのこと。Google製。CDNでインストールでき導入も容易そうでした。

PWACompatをasync呼び出しして少し画面を表示してから「ホーム画面追加」のポップアップを出すDEMOが良さげでした。少しの間でだいぶ印象が変わりますね。

LT:PWA作って満足してませんか？ @iret_oyamatsuさん

PWA作ったら、効果測定しましょう！の話。PWAを作った段階でおしまいではなく、そのあとのPWAアプリへのアクセスなど効果測定をしていくための内容でした。具体的には、流入自体はGAで拾えるが、メディアクエリを用いて検知しているとのこと。また、manifest.jsonにstart_urlを追加できるので、そこにパラメータを渡して検出するなど。また、実際にPWAの運用を始めたら、PWA

PWA自体は新しめの技術ではありますが、実践していくだけでなく、実際の効果なども取得しての事例紹介が今後増えてきそうですね。

LT:PWAをもっと手軽に、PWA Manager @kindbackさん

PWAをより簡単に作ることができるツール「PWA Manager」を作成したという内容でした。また、このLTでも上述のWorkboxとOneSignalの話が上がってました。PWA Managerのurlは以下ですが、現在改修中とのことだったので、まだ利用できないかもしれません。

PWA Manager

感想

PWA自体がまだ触り始めたばかりで知らないことが多かったのですが、大変学びの多い勉強会でした。アイコンバッジやiOSの通知対応等が進めば、より商用利用も含め、広範囲のユーザが実運用で使われていくようになりそうです。WorkboxとOneSignalはしっかり触っておきたいですね。

WEBゲームやスケジュール調整ツール等、PWAに向いてそうな簡易なものから少しずつ手を入れていこうと思いました。

ただ、PWAもアプリ同様、ホーム画面にアイコンを1つ増やさないといけないので、ホームをスッキリさせたい族としては、PWAを一括管理できるできるツールとかできないかなぁと妄想してました(LINE@みたいにQRでピッと1アプリ配下に追加したい)。

PWANight非常に面白く、PWA自体の今後の発展も早い展開になりそうなので、今後も参加していきたいです。