PWA（プログレッシブウェブアプリ）とは？ネイティブアプリとの違いを徹底解説

テクノロジー好きなら、「プログレッシブアプリ（Progressive Apps）」という言葉を目にしたことがあるでしょう。「これからのアプリの未来だ」「すべてのサイトが対応すべきだ」と語る記事を。

では、プログレッシブアプリとは一体何なのでしょうか？標準的なウェブアプリと根本的に異なるわけではありませんが、開発者が満たすべき特定の要件が存在します。

PWA（プログレッシブウェブアプリ）とは？

プログレッシブウェブアプリ（PWA：Progressive Web App）とは、ブラウザ上で動作する、HTML・CSS・JavaScriptで構成されたウェブアプリのことです。モバイルサイトとアプリの中間に位置する「ハイブリッド型」と捉えることもできます。

PWAは最新のウェブ技術を活用しており、開発者はユーザーにネイティブアプリのような体験を提供しながら、より高速で安全なサイトを構築できます。実体は普通のウェブサイトですが、ユーザーの目にはアプリのように映るのです。

また、最新のウェブ標準に準拠して設計されているため、ほぼすべてのブラウザで正しく、かつ高速に動作します。

さらに、インターネット回線が遅くても瞬時に読み込まれます。オフライン環境でも、動的コンテンツを除けばアプリを利用できる点も大きな特徴です。

プログレッシブウェブアプリをオフラインで使う方法

PWAをオフラインで利用するには、Chromeの実験的な機能を有効にする必要があります。Chromeのアドレスバーに以下のコマンドを入力してください。
chrome://flags/#bypass-app-banner-engagement-checks

画面下部に表示される「Relaunch Now（今すぐ再起動）」ボタンをクリックします。その後、PWAを採用しているサイトを訪れると、インストールを促すプロンプトが表示されるようになります。

なお、当時のSafari/iOSではPWAが動作せず、オフラインモードやプッシュ通知、ホーム画面へのインストールといった機能は利用できませんでした。Appleの対応が待たれるところです。

PWAの代表例として挙げられるのがTwitterのサイトです。「ホーム画面に追加」のプロンプト表示、データ消費量の削減、Service Workerスクリプトによるほぼ瞬時の読み込みなど、PWAとしてあるべき姿を備えています。

プログレッシブアプリのセキュリティ

PWAはブラウザ上で動作するため、アプリストアは不要です。また、セキュリティ確保のため常にHTTPSを使用します。HTTPSに対応していないサイトは、PWAとして認められません。サーバーにはSSLまたはTLS証明書が導入されている必要があります。

PWAはあらゆるデバイスに対応しています。スマートフォン、タブレット、PCなど、デバイスの種類は問いません。App Shell（アプリシェル）モデルで構築されているため、アプリらしいナビゲーションと操作感を実現できます。

Service Workerによる更新プロセスがコンテンツを常に最新に保ってくれるため、古いバージョンのアプリを使い続ける心配もありません。URL経由で手軽に共有でき、アプリストアに頼らずともホーム画面に追加できるのも魅力です。

モバイルのホーム画面に追加できるだけでなく、プッシュ通知の送信にも対応しています。導入企業にとっても、メンテナンスの時間とコストを削減できるというメリットがあります。

FirefoxもChromeにならい、Firefox 58以降でPWAをサポートしました。有効なマニフェストを持ちHTTPSで配信されているサイトにアクセスすると、アドレスバーにバッジが表示されます。

そこを選択すると「ホーム画面に追加」というメッセージが現れます。ホーム画面から起動したアプリ内で外部リンクをタップしても、サイト上での作業状況は失われません。

PWAとネイティブアプリの比較

PWAにはネイティブアプリを上回る強みがあります。開発者がプラットフォームごとに個別のアプリを作る必要がなくなり、時間とコストを大幅に節約できる点です。

開発者は1つのアプリを作るだけで、現在存在するすべてのプラットフォームとデバイスで動作させられます。ネイティブアプリと異なり、PWAは使用前に何かをインストールする必要もありません。

一方で、PWAはまだ比較的新しい技術であるため、課題も残ります。例えば、タブレットやスマートフォンの端末機能との連携には限界があります。

Bluetooth、指紋センサー、加速度センサー、NFCなどのハードウェア機能とはまだ統合できません。現時点ではネイティブアプリの方が信頼性が高いと言えますが、今後どうなるかは時間が証明してくれるでしょう。

とはいえ、PWAとネイティブアプリは思ったほど違わないものです。どちらもホーム画面から起動され、非常に似たユーザーインターフェースとウェブ体験を提供します。

PWAの限界

PWAは次の大きなトレンドと目されていますが、弱点もあります。例えば、Edge、Safari、Internet Explorerなどの一部のブラウザでは動作しません。SamsungのAndroidブラウザ、Opera、Chromeなど、新しいバージョンのブラウザでは問題なく動作します。

この制限はデバイスにも及びます。すべてのデバイスがPWAをサポートしているわけではありません。AndroidはPWAに対応していますが、比較的新しい技術であるため、サポート面でいくつかの課題が残ります。

iOSについては、通知やホーム画面へのショートカット表示のサポートに問題があるため、PWAを完全にはサポートしていませんでした。Appleが今後PWAへ正式対応するかどうかは、長らく公式発表がありませんでした。

また、アプリ間でのクロスログインが重要な方は注意が必要です。PWAはデータを独立して収集できないため、この機能には対応していません。

まとめ

プログレッシブアプリはまだ比較的新しい技術であり、対応を進める企業もあれば、検討段階にある企業もあります。しかし、モバイル体験を向上させる可能性を考えれば、間違いなく将来性のある技術と言えるでしょう。

あなたはPWAが業界に定着すると考えますか？それとも廃れていくと思いますか？ぜひコメントで意見を聞かせてください。