まず前置きとしてPWAを否定するものではございませんのでご了承のほどをお願い致します。総括するとまだ時期が早いと思ったので、実装の対応をやめる方向にしました。
WordPressでのPWAの対応方法
PWAの実装はAMP関係なしにできるのですが、AMPと連携させてより効果を発揮させる方法として以下の3つのアプローチがあります。
- AMP as PWA = AMPページでPWAを提供する
- AMP to PWA = 検索経由でAMPページを表示して後、PWAを提供する
- AMP in PWA = PWAをAMPで実装する
私の個人的な所感ですが、すでにある既存サイトをできるだけ工数をかけずにPWA対応するなら「AMP to PWA」が一番良いのかなと思いました。
で、その実装方法は以下の記事を参考にしました。
脱ネイティブ!Googleが推進する「PWA」にたった数時間で対応する方法
上記の方法を簡単に説明すると、Webアプリのマニフェストを作成する、ローカルに読み込むファイルを決めてservice-worker.jsを作成するという手順です。プッシュ通知のところの対応方法はのっていません。
デモ画面

なぜやめたのか
実際コードを書いてみると分かるのですが、そこまで難しい作業でもなく、単純作業なのでWordPressにおいてはいずれAMPプラグインを作ってるAutomatic社あたりがプラグインを作成するんじゃないのかなと思いました。まだPWAの仕様などもこれからどんどん変わっていくでしょうし、保守的なところも考えると今後出てきたプラグインにそのへんは丸投げしたほうがいいかなと考えたのが1点。
2点目は、アプリ化するならアプリっぽいUI,UXを提供しないとインストールしてもらうメリットもないですし、中途半端にホームに追加のバナーを出してうざがられるよりはない方がいいのかなと思いました。オフラインや低速度でも動くということもあるのでしょうが、現在、山の中とかでなければ逆に圏外の環境を探すほうが困難なぐらいインフラ環境は発達してきていますし、回線速度も日に日に速くなってきています。よって自分はそこにメリットは感じられませんでした。(ギガが減る問題はありますがw)
3点目は、iPhoneが対応していないということ。iOS11あたりでService Workerの対応をしてくるんじゃないのかなとも思ってたのですが、調べてもiOS11での情報はなさそうでした。AppleはAppStoreからアプリをインストールさせてアプリ内課金をさせて収益を得たいというところなのかなと思いました。
アプリ内課金の手数料で儲けたいからsafariに依存させつつWebサイトには誘導させたくないApple
vs
広告収入のために検索のUX上げたいのでAMP+PWAを推進するGoogle
— 山根 翔 👻 (@sho_yamane) 2017年6月10日
とはいえ時期をみて早めに対応したほうが良さそう
うだうだ書きましたが、まとめるとWordPressにおいてはPWAのプラグイン待ちで対応したいというところです。PWAを導入することによって、SUUMOなどは効果を上げているようですし、時期を見計らって積極的に対応していきたいです。
WordPressでAMP + PWA(プログレッシブ ウェブアプリ)を実装する方法を模索しながら、今はこうやっています