開発コミュニティでのモバイルオペレーティングシステム用アプリケーションの開発への関心は着実に高まっており、アプリケーションの作成を可能にするツールとアプローチの数が増えています。 今日は、新しいアプローチの1つであるProgressive Web Appsについて書きたいと思います。
PWAとは何ですか？
PWAは、Webテクノロジーのスタック（JS + HTML + CSS）を使用するアプリケーションのグループの名前であり、Webサイトの使いやすさとネイティブUX固有のアプリケーションおよび技術的能力を組み合わせることができます。
PWAの主な目的は、モバイルデバイス上のWebアプリケーションの変換、ユーザー数、および使いやすさを向上させることです。
Progressive Web AppsはAccelerated Mobile Pagesの論理的な継続であるため、AMPアプリケーションを以前に作成したことがある場合は、間違いなくアプリケーションをPWAアプリケーションの標準に更新する必要があります。 以前にAMPについて聞いたことがない場合は、PWAの学習中にこれは問題になりません。
PWAアプリケーションの要件は次のとおりです。
- プログレッシブ-漸進的な改善の方法を仕事の主な原則として使用し、環境に関係なく各ユーザーと協力します。
- 適応-デスクトップ、スマートフォン、タブレットなど、あらゆるデバイスに合わせて調整します。
- 接続に依存しない-Service Workerを使用すると、アプリケーションは接続が中断または接続されていないときにオフラインで動作するはずです。
- ネイティブに見える-アプリケーションは、ユーザーの通常の対話およびナビゲーション方法に対応している必要があります。
- 自己更新-アプリケーションは、Service Worker APIを介して自動更新のプロセスを制御する必要があります。
- 安全-HTTPSを使用して、データの傍受および置換を防止します。
- 定義済み-W3CマニフェストおよびService Workerによる登録を通じて、アプリケーションは検索エンジンによって「アプリケーション」として識別されます。
- 制限-技術的な機能を使用して、プッシュ通知などにより、ユーザーがアプリケーションを再び使用するように動機付けます。
- インストールが簡単-アプリケーションストアを使用せずに、インストールされたアプリケーションのリストにPWAアプリケーションを追加することにより、ユーザーのデバイスにアプリケーションを「保存」できます。
- 使いやすい-アプリケーションの使用を開始するには、URLを開くだけです。 アプリケーションのインストールはオプションです。
対象者
WebサイトまたはWebアプリケーションの作成、サポート、または開発に関与する各人は、興味があるかもしれません。 PWAを使用すると、製品、変換、ユーザー数、モバイルプラットフォームのユーザーによるリソースの使いやすさが向上します。
標準作業プロセス
ユーザーは、スマートフォンを使用して、任意のアプリケーションを介して受信したリンクを開き、Webページを読み込んだ後、使用可能な本格的なアプリケーションを受信します。
したがって、アプリケーションストアに移動してユーザーに必要なアプリケーションがインストールされるまで待つ必要がないため、新しいアプリケーションの使用を開始するのがはるかに簡単になります。
必要に応じて、ユーザーは[ホーム画面に追加]ブラウザーのオプション項目を使用してデスクトップにアプリケーションを追加できます。 または、アプリケーションは、ユーザーにWebアプリのインストールバナーを介してこれを行う代わりにこれを行うように提供する場合があります。
その後、アプリケーションマニフェストで以前に指定されたアイコンがユーザーのメイン画面に作成されます。 開発者は、インストール後にアプリケーションのブラウザスタイルと表示オプションを制御できます。 また、PWAアプリケーションにバンドルされているService Workerは、キャッシュ、オフライン作業、プッシュメッセージ処理を担当します。
サイトリンク
ウェブの基礎-developers.google.com/web/fundamentals/?hl=en
プログレッシブWebアプリ-developers.google.com/web/progressive-web-apps
結論の代わりに
この記事は、PWAに関する一連の記事の最初の記事として考案されましたが、 以前は、PWAはHabrahabrで検討されていませんでしたが、聴衆がこのトピックに対してどれほど興味深いかを理解することは興味深いです。 したがって、技術シリーズを開始する前に、調査を通じて、あなたが興味を持つことを確認したいと思います。 ボーナスとして、調査の進行中に、実世界からの例を検討する方が興味深いため、例として取り上げられるプロジェクトを（PMで）提供できます;）
調査が成功した場合は、githubにあるオープンソースPWAに関する一連の記事を期待してください。