Progressive Web Apps
The web...それよりもいいもの
Progressive Web App (PWA) は、最新の Web 機能を使用して、ユーザーにアプリのようなエクスペリエンスを 提供する Web アプリです。 これらのアプリは、特定の要件(下記参照)を満たし、サーバーに展開され、URL からアクセスでき、検索エンジンにインデックスされます。
Capacitorと連携して、すべてのユーザーに複数のデプロイ対象を提供することができます。 アプリを PWA としてデプロイするだけでなく、ネイティブアプリとしてデプロイし、両方のチャネルを活用することができます。
Ionic では、アプリストアへのリリースだけでなく、PWA としてモバイル Web にデプロイすることも可能です。
要求されるもの
Progressive Web App と見なされるには、アプリが以下の要件を満たしている必要があります。
-
プログレッシブ - ブラウザの種類に関係なく、すべてのユーザーに対して機能します。これは、プログレッシブ・エンハンスメントを中核として構築されているためです。
-
レスポンシブ - デスクトップ、モバイル、タブレットなど、あらゆるフォームファクターに対応。
-
接続に依存しない - オフラインや低品質のネットワークでも動作するように、サービスワーカーが強化されています。
-
アプリライク - アプリシェルモデルを使用し、アプリスタイルのナビゲーションとインタラクションを提供します。
-
フレッシュ - サービスワーカーの更新プロセスにより、常に最新の情報を提供します 。
-
安全 - HTTPS 経由で提供され、盗聴を防止し、コンテンツが改ざんされていないことを確認します。
-
発見性 - W3C マニフェストとサービスワーカー登録により、「アプリケーション」として識別可能であり、検索エンジンに見つけてもらうことができます。
-
再エンゲージメント - プッシュ通知などの機能により、再エンゲージメントを容易にします。
-
インストール可能 - アプリストアのような煩わしさがなく、ユーザーが最も便利だと思うアプリをホーム画面に置いておくことができます。
-
リンク可能 - 複雑なインストールを必要とせず、URL で簡単に共有できます。
Addy Osmani: Progressive web apps
たくさんありますが、Ionic アプリの場合はいくつかのポイントに集約されます。
オフライン対応
アプリはオフラインで動作する必要があります。適切な「オフライン」メッセージの表示や、表示用にアプリデータをキャッシュすることなどです。
Web App Manifest
App Manifest ファイルには、アプリに必要なリソースを記述する必要 があります。これには、アプリの表示名、アイコン、スプラッシュ画面などが含まれます。index.html Manifest ファイルにリンクすると、ブラウザがそれを検出し、リソースを読み込むようになります。
Service Worker
Service Worker については、オフライン サポートの項でも触れましたが、本当は独自のセクションが必要です。Service Worker は、アプリのリソースをキャッシュするためのプログラム的な方法を提供します。JavaScript ファイルであれ、HTTP リクエストの JSON データであれ、です。プログラム的な API により、開発者はキャッシュをどのように処理するかを決定でき、他の選択肢よりもはるかに柔軟なエクスペリエンスを提供します。