Googleの最先端テクノロジー「PWA」とは？

こんにちは！住民の勝田です。

現在、リバ邸渋谷ではPWAという技術が話題になっています。PWAとは、Progressive Web Appsの略称で、Googleが2015年のGoogle I/Oで発表してから、アメリカやインドを中心に話題になっています。

簡単に言うと、ネイティブアプリのUIをもったスマホブラウザ内で動作するWebアプリのことです。以下のGIFが分かりやすいのでご覧ください。

ブラウザで検索したページをホーム画面に保存した後、開いてみるとネイティブアプリと同じようなUIを持つページが現れました。実際にPWAを用いたものを使ってみたのですが、ほぼアプリの動きをしていました。

以下、特徴です。

・GIFを見ると分かるように、ホーム画面へ保存でき、ネイティブアプリと同じUIを持つ

・アドレスバーがなくなり、フルスクリーン表示できる

・Service WorkerというJavascriptのライブラリを介してサーバーにアクセスすることでオフラインでも動作可能（iOS開発中？）

・Firebase Cloud Messagingなどを使ってPush通知の送信をすることで、PWAを閉じていても通知がスマホに届く設定ができる（iOS開発中？）

・開発が楽になる（iOSとAndroid同時に開発できるため、ネイティブアプリと比べて開発コストは非常に小さくなる、Web技術(Javascript)でアプリを開発できる)

・検索であがってくる

・インストールがアプリに比べて楽（インストールで脱落するユーザーが少なくなる）

・ネットのスピードが遅い発展途上国でのビジネスと相性が良い。（インドで話題なのはこのため）

・アプリを作る度にAppleに30%持っていかれることもない。

最後のはAppleにとってかなり大きな問題ですね。今後Appleは、プッシュ通知，オフライン対応をSafariでもサポートしていく体制をとっていくようですが、そうなると30％のApp Storeからの収益が年々減っていくわけで。。

開発者側から見れば、ネイティブアプリかPWAのどっちを採用するのか、という考え方ではなく、PWAで簡易的なアプリを作って、ユーザーの反応を確認してからネイティブアプリを作る、という考え方もできそうです。

日本ではまだ普及していない、今がチャンスです！今のうちに知見を溜めておきましょう。

じゃあ何から始めればいいの？という話になりますが、私は今 Udemy でVue.jsを勉強しています。Angular、Reactなどのフレームワークに比べて、習得が簡単と言われているためです。（それぞれのフレームワークについては、Qiita等で色々比較記事があるので調べてみてください）

こちらの動画は2017年の Google I/O の動画です。それぞれのJavaScript のフレームワークについて話しているので、参考になります。

今回の記事は、先日お会いした Takeshi Amano さんという方のお話を整理して書いています。詳しく知りたい方はブログを見てみてください。
Source:

関連記事