PWAに興味を持っている人向けに概要とか動向とかをまとめた

PWAについて興味を持ちつつ、実際いろんな見解を目にしたり、事例がよくわからなかったりしたので、調べてまとめました。

(追記)
一部更新を行いましたが、もともと2018年の4月に書いた内容です。
そのため新しい情報が反映されていないこともあります。


## PWAとは
Progressive Web Appsの略で、Googleの[はじめてのプログレッシブ ウェブアプリ](https://developers.google.com/web/fundamentals/codelabs/your-first-pwapp/?hl=ja)によると下記の説明がされています。
> ウェブとアプリの両方の利点を兼ね備えたアプリです。ブラウザのタブで表示してすぐに利用することができ、インストールの必要はありません。使い続けてユーザーとの関係性が構築されていくにつれ、より強力なアプリとなります。不安定なネットワークでも迅速に起動し、関連性の高いプッシュ通知を送信することができます。また、ホーム画面にアイコンを表示することができ、トップレベルの全画面表示で読み込むことができます。

ざっとこんな感じの特徴があります。
- モバイルアプリの様なUI
- プッシュ通知
- オフラインで動作する

詳細に関しては先ほどのgoogleの記事か、[いまさら聞けないPWAとAMP](https://qiita.com/edwardkenfox/items/4c0b9550ffa48c1f0445)がとてもわかりやすいです。

PWAに関する記事は多く見つかったのですが、実際にはこれまた先ほどのgoogleのページに実践的な内容がまとまっているため、ここら辺を参考にするのがよいかと思います。
[ウェブアプリへの Service Worker とオフラインの追加](https://developers.google.com/web/fundamentals/codelabs/offline/?hl=ja)
[ウェブアプリへのプッシュ通知の追加](https://developers.google.com/web/fundamentals/codelabs/push-notifications/?hl=ja)

英語ですがこちらも
[Progressive Web App Checklist](https://developers.google.com/web/progressive-web-apps/checklist)

(追記)
2019年のDroidkaigiの登壇資料で、PWAの説明とPWAでTikTokっぽいアプリを作ってGoogle Play Storeで公開をするところまでを説明してくれています。
[PWAでここまでできる](https://speakerdeck.com/samukei/pwadekokomadedekiru)

## なぜ今PWAなのか
2016年5月の[Google I/O](https://events.google.com/io2016/)の際には話題の中心だったそうです。
この時にはsafariが未対応であったため、Appleの動きが重要になるということはよく目にしてきました。

しかし最近の動向を見ると

2018/2/14の記事
[AppleもiOS/macOSをProgressive Web Apps（PWA）対応へ。次のSafari 11.1でService Workerなど実装](http://www.publickey1.jp/blog/18/apple_ios_macos_progressive_web_apps.html)
> Appleが、iOSとmacOSの次バージョンにバンドルされるSafari 11.1で、Progressive Web Apps（PWA）の重要な構成要素であるService Workerをサポートすることが分かりました。

2018/4/7の記事
[First Windows 10 Progressive Web Apps (PWA) published by Microsoft hit the Store](https://www.windowscentral.com/first-batch-windows-10-progressive-web-apps-here)
> Microsoft is publishing new web-apps to its Store under its name. This is the first wave of PWAs for Windows 10.

このように徐々にPWAをサポートする動きが広まっていることから、今まさに注目を浴びているのではないかと思います。

また、勉強会の資料で[東南アジアでのPWAの可能性](https://drive.google.com/file/d/137EU0LDKJRbTf0k-2GAarA8KcvbIuqeH/view)という内容を読んだのですが、海外のニーズということも大きく影響があるのかもしれません。
こちらも東南アジアの現在の状況からPWAが東南アジアではニーズが高まるのではないかということが書いてあるので、海外にサービスを展開していく(している)場合には検討の余地があると思います。

さらにさらに追記です。

2019/1/31の記事
[Google Play Store now open for Progressive Web Apps ](https://medium.com/@firt/google-play-store-now-open-for-progressive-web-apps-ec6f3c6ff3cc)
> Chrome 72 for Android shipped the long-awaited Trusted Web Activity feature, which means we can now distribute PWAs in the Google Play Store! 

上記の記事は英語ですが、下記の記事は日本語でまとめてくれています。
[Google Play StoreでPWAを配信できるらしい](https://www.hypertextcandy.com/pwa-on-google-play-store)

### いろいろな見解についても調べてみた
[PWAが来るって言っているエンジニアは今すぐ辞めろ](https://anond.hatelabo.jp/20180321171652)
グーグルのエバンジェリスト?のツイートに対する意見ですね。

[結局PWAは来るの？来ないの？](https://blog.agektmr.com/2018/03/instagram-pwa.html)
そのグーグルの人が上の記事を読んでいろいろと説明をしてくれている。

[PWAの将来性についての考察](http://lab.astamuse.co.jp/entry/2018/04/11/114500)
PWAの課題とかWebへの影響とか。

## 事例
実際に導入してるところってどんなところがあるんだろうって思って調べてみたら、このサイトがよくまとまってました。
[モバイルWebの高速表示＆アプリライクな操作性を実現する、AMP＆PWA導入サイト事例8選](https://www.i3design.jp/in-pocket/5997)

もう少し中の人の話よりの事例だとここら辺がおすすめです。
[pixiv chatstoryのPWA採用事例](https://inside.pixiv.blog/ikasoumen/3513)
[リニューアルで表示を高速化させた「日経電子版のページ高速化とPWA対応」プロジェクトの舞台裏](https://codeiq.jp/magazine/2018/02/56884/)

## とりあえず動かしてみたい人は
paizaのブログで紹介されていた、スプレッドシートのデータを読み込んでPWAとして公開ができるサービスをやってみたり
[簡単過ぎる！GoogleスプレッドシートからPWAアプリを開発できる「Glide」を使ってみた！](https://paiza.hatenablog.com/entry/2019/04/10/%E7%B0%A1%E5%8D%98%E9%81%8E%E3%81%8E%E3%82%8B%EF%BC%81Google%E3%82%B9%E3%83%97%E3%83%AC%E3%83%83%E3%83%89%E3%82%B7%E3%83%BC%E3%83%88%E3%81%8B%E3%82%89PWA%E3%82%A2%E3%83%97%E3%83%AA%E3%82%92%E9%96%8B)

vuejsでもpwa用のテンプレートを用意してくれているので触ってみてはどうでしょうか(reactもあると思うけど使ったことないので知らないです)
[vuejs-templates/pwa](https://github.com/vuejs-templates/pwa)



## ついでに
最近勉強会も活発になってきたイメージです。
~~connpassの[PWA for beginners](https://pwa-for-beginners.connpass.com/)や[Japan Android Group](https://japan-android-group.connpass.com/)でもWeb Working Group 「[PWAに備える３ヶ月](https://japan-android-group.connpass.com/event/82299/)」などをやってますね。~~

上記の勉強会は継続されていないようですが、新しく下記のシリーズもやっているようです。(勉強会で使った資料は参考になるかもしれないので残しておきます)
[PWA Night vol.1 ～PWAのミライや活用方法をみんなで考えよう～](https://techplay.jp/event/716487)
[2019年2月定例会「CES報告会&SDL&最新PWA」](https://japan-android-group.connpass.com/event/118569/)