Skip to main content

PWA(Progressive Web Apps)

参考URL

簡潔に言うと Webサイト/Webアプリをネイティブアプリのようにアプリとしてインストール可能にする技術

PWAはGoogleが提唱している概念であり、具体的な要件などは明確ではないが、その特徴としていかが明記されている

Discoverable:コンテンツを検索エンジンで見つけることができる Linkable:URLでアプリやコンテンツを共有できる Safe:アプリとサーバーとの通信経路が安全で第三者からの攻撃を受けない Responsive:携帯電話、タブレット、PC、スマートTV、スマート冷蔵庫などさまざまなデバイスで利用できる Progressive:古いWebブラウザでも基本的な機能は使用でき、最新Webブラウザではフル機能が使用できる Installable:アプリを端末のホーム画面に追加できる Network independent:オフラインや貧弱なネットワーク環境でも使用できる Re-engageable:新しいコンテンツがあるときに通知を送信できる

PWAメリット

エンゲージメント¥という視点で見ると、メリットがある ホーム画面にアイコンが持てる

実際の運用上はまずPWAをインストールしてもらうというエンゲージメントの確立が必要になってくる それにより、魅力的なコンテンツ作りの話になったり、PWA自体と別の話になってくるためそこは頑張りどころ

オフラインでも動作する

プッシュ通知などの機能も利用ができる

PWA 言語

PWAはServiceWorkerをベースにして製作される。ServiceWorkerとはWeb上で動くプログラミング言語であるJSで作られたプログラム環境で、Webサイトのバックグラウンドで起動する

Service Workersとは

モバイル端末では状況によって通信回線の品質が大きく変化する可能性がある。たとえば地下などの場所では通信がしにくくなるほか、基地局が整備されておらず圏外になるような場所もある。スマートフォンアプリではネットワークが利用できる場所でコンテンツをダウンロードし、端末内に保存(キャッシュ)しておくことで県外や通信が繋がりにくい場所でもコンテンツにアクセスできる仕組みを導入しているものがあるが、これと同様のことをWebアプリでも可能にする技術がService Workers

簡潔に言うと Service WorkerはブラウザがWebページとは別にバックグラウンドで実行するスクリプトで、Webページやユーザーのインタラクションを必要としない機能をWebにもたらします。 既に現在、プッシュ通知やバックグラウンド同期が提供されています。

pwa 実装例

参考URL

このサイトはいい