iOS 15のPWA:改善? [iOS15.4が更新されました]

公開: 2021-12-13

目次

Appleは、iOS 15は、新機能の重要なリストを使用して、接続を維持し、集中し、探索するためのより良い方法を提供すると主張しています。 しかし、PWA開発者の生活を楽にすることができるものはありますか? この記事では、いくつかの興味深いニュースとともに、すべての最大の変更点である失望について説明します。

PWAのすべての改善

[iOS 15.4]ServiceWorkerのナビゲーションプリロード

iOS 15.4は、ナビゲーションのプリロードやService Workerで生成されたファイルのサポートの強化など、ServiceWorkerのいくつかの新しい改善を展開します。

場合によっては、サービスワーカーが起動すると、ネットワークの応答時間が長くなる可能性があります。 ナビゲーションプリロードは、Service Workerの起動時にネットワーク要求を要求します。これは、PWAのパフォーマンスに役立ちます。

[iOS 15.4]改善されたWebアプリマニフェスト:アイコンなど

朗報です! 生涯待った後、PWA開発者は最終的に適切なアイコンを使用してiOS15.4にWebアプリを実装できます。 Webアプリファイルにapple-touch-iconが定義されていない場合、デフォルトでWebアプリマニフェストアイコンが設定されます。

ただし、サポートはまだ完全ではありません。 次のような、ユーザーと開発者の両方のエクスペリエンスに影響を与えるマイナーなバグがまだいくつかあります。

  • アイコンの形状と形式は、正方形のPNGのみに制限されています。
  • アイコンは、iOSの事前定義されたサイズと一致しない場合、自動的にサイズ変更されます(Ipad – 152 x 152&167 x 167、iPhone – 120 x 120&180 x180)
  • 共有シートを開いたときにアイコンは表示されませんが、[ホーム画面に追加]を選択すると最終的に表示されます。
  • 透明なアイコンの背景は黒または白になります。

さらに、以前のバージョンでは、Webアプリマニフェストは、ユーザーが「ホーム画面に追加」を選択した場合にのみフェッチされます。 iOS 15.4では、ページが既に読み込まれているときにファイルが解析されて読み込まれるようになりました。 その結果、ページの読み込み時にテーマの色を適用できるため、PWAの信頼性が高まります。

[iOS15.4]Webプッシュ通知

昨年PWAiOS15の記事を書いているとき、Webプッシュ通知がどのように行われるかについていくつかの証拠を共有し、それが何であるかを推測します。それはついに起こります。

Webアプリマニフェストアイコンと同様に、Webプッシュに関連するいくつかの不便がまだあります。 たとえば、デフォルトでは無効になっているため、使用するにはまずそのことを知っておく必要があります。 また、一部のPWA開発者は、Web Push APIを使用して通知権限を要求することはできませんが、オプションはあります。

しかし、それは価値のあるニュースです。 何がいいですか? Web Kitは、macOSVenturaのSafari16でのWebプッシュのサポートを発表しました。 彼らのからかいによると、Webプッシュは2023年にiOSとiPadOSで利用可能になるかもしれません。

サポートされているテーマの色

Webアプリマニフェストのサポートステータスはまだ「部分的にサポート」ですが、Safari15ではHTMLメタタグWebマニフェストでテーマカラーが正式に有効になっています。 これで、ステータスバーオーバースクロール領域色を変更できます。これは、 Ipad OS 15、Big SurMacOSMontereyのSafari15CompactTabレイアウトのタブバーとオーバースクロールの背景色にも適用できます。

さらに、media属性を使用することで、Safari15のプログレッシブWebアプリのダーク/ライトモードを有効にすることもできます。

 <meta name = "theme-color" content = "#ecd96f" media = "(prefers-color-scheme:light)">
<meta name = "theme-color" content = "#0b3e05" media = "(prefers-color-scheme:dark)">

強化されたWebGL(Webグラフィックライブラリ)およびWeb-Share API

iOS 15は、WebGL1からWebGL2へのアップグレードを目撃しています。 WebGL 2は、WebGLよりもはるかに高速で、はるかに多くのテクスチャを提供するだけでなく、他の多くの利点を備えた重要な拡張機能であることが証明されています。

さらに、Safari 15にはWeb共有レベル2のサポートが含まれています。これにより、開発者はネイティブ共有ダイアログを使用してブラウザーからアプリにファイルを効果的に交換できます。 現在、画像、ビデオ、オーディオ、テキストファイルなどをサポートしています。

たとえば、この変更により、ユーザーは、写真をライブラリに保存して再アップロードするという追加の手順を実行することなく、PWAページからTwitterアプリに画像を直接共有できるようになります。

より良いメディアセッションAPI

メディアセッションAPI

Media Session APIは、より多くのデータと再生コントロールを提供するため、メディアエクスペリエンスをより高いレベルに引き上げます。 iOS 15以降、ユーザーはControl Centralロック画面MacOSMontereyのメニューバーからNOWPLAYカードにアクセスし、いくつかの簡単な再生オプションを制御できます。 さらに、新しいメディアセッションは、Facetimeを介して映画を見たり、友達と音楽を聴いたりできるSharePlayエクスペリエンスをもたらします。 これは、Webベースのポッドキャストアプリにとって朗報です。

SafariのWebMオーディオサポート、IpadのWebM/VP9サポート

WebMは、オープンソースのロイヤリティフリーのWebビデオストリーミングテクノロジーです。 iOS 14で最初にWebMイメージを導入した後、AppleはSafari 15でOpusオーディオコーデックWebMコンテナーをサポートするようになりました。さらに、ユーザーはIpadOS15でWebM/VP9ビデオをストリーミングできるようになりました。

このアップデートは、近い将来WebMの完全なサポートを約束し、WebMビデオがモバイルSafariでまもなく利用可能になると期待できます。 その結果、PWAの所有者は、より良いユーザーエクスペリエンスを提供するために、ビデオメディアを表示するための選択肢が増えます。

ServiceWorkerでのES6モジュールのサポート

ES6は、JavaScriptの最初の組み込みモジュールであり、動作の操作、保守、スケールアップ、およびカプセル化が容易な堅固な構造を提供します。 新しいES6モジュールがServiceWorkerに導入されたことで、開発者はパフォーマンスを向上させ、iOSPWAのオフラインアクセスをより組織化された方法で有効にできるようになりました。 その結果、必要に応じて市場の需要を満たすために、迅速にスケールアップし、PWA機能を増やすことが簡単にできます。

iPad用のよりシンプルなマルチタスク

iOS 15は、以前の機能を維持しながら、iPadでのより直感的なマルチタスクエクスペリエンスのためにいくつかの改善を行いました。 たとえば、ディスプレイ上部にマルチタスクメニューを表す新しい3つの小さなドットのタブがあり、アプリを全画面表示、分割画面、またはスライドオーバーにします。 さらに、ホバリング中心のウィンドウがSplitScreenに導入されました。このウィンドウでは、分割画面アプリの上部にあるウィンドウを開いて、スライダーオーバー、分割ビュー、または全画面に送信できます。

iPADOS15マルチタスク
(写真:AppleInsider.com)

さらに、すべてのアプリ(スライドオーバーのアプリを含む)を表示する新しいキーボードショートカットと新しいマルチタスクユーザーインターフェイスについては、簡単に説明する価値があります。

レビューからこれまでのところ、WebおよびPWA用のIpadマルチタスクの新しいアップグレードは、iOS14よりもはるかにユーザーフレンドリーであるという肯定的なフィードバックを受け取っているようです。

新しいアプリクリップ–もう1つの注目すべきアップデート

PWA iOS 14 WrappingUpのAppClipは、Androidのようなインストール可能なPWAに期待されるものとして言及しました。 では、今はどうですか?

App ClipをWebサイトと統合できるようになり、その結果、Safariに表示されます。 このカードを使用すると、ユーザーは食べ物の注文、自転車のレンタルなどの最初のタスクを完了してから、AppStoreにネイティブアプリをインストールするように求められます。 新しい変更により、iOS 14のいくつかの余分な手順が削減され、Webページおよびサードパーティアプリ内のアプリクリップが検出されます。

アプリクリップiOS15
(写真:9to5mac.com)

残念ながら、PWAインストールバナーはまだ表示されていません。 AppleはアプリクリップをPWA対応にしますか? それとも、独自のPWAバージョンを作成しようとしていますか? それとも、アプリのクリップとPWAがまったく関係していないのでしょうか。 答えはまだ未来です。

大きな制限はありません

新しいiOS15リリースは確かにPWA開発にいくつかの失望をもたらします。明らかに、私たちが探しているものはまだテーブルから外れています。 これらの機能を利用できない状態でiOS15にPWAを実装することは、依然としてかなり困難な作業です。

  • バックグラウンド同期
  • Webプッシュ
  • インストールプロンプトとインストールバナーをインストールする前に
  • PWAのバックグラウンドオーディオ

さらに、iOS14の記事でも言及したいくつかの悪い点に対する修正はありません。

  • アプリライブラリにPWAアイコンがありません
  • Webアプリマニフェストサポートへの変更はそれほど多くありません(テーマの色以外)
  • ステータスバーはまだblackblack-translucentのみです。
  • 他のWebブラウザの大きな機能制限

取り除く

iOS15がPWAのために持っているすべてのものがあります。 15バージョンでのほとんどの変更は軽微ですが、Webプッシュおよびより多くのWebアプリマニフェストをサポートするiOS 15.4は、iOS上のPWAの明るい未来を切り開きます。 2022年9月にリリースされたiOS16ベータ版で、さらに重要な変更が行われることを期待しましょう。