PWAをホーム画面に追加したあと、サイト側のアイコン画像を変更したら、インストール済みのアイコンも自動で切り替わるのでしょうか。
OJappの開発中、この疑問が気になったので、実際にスマートフォンへ追加して確かめることにしました。変更するのはアイコン画像。PWAの識別に関わるidはそのままです。最初のアイコンは「OJapp」、変更後は「OJapp PRO」。見た目で違いが分かる組み合わせにしました。
そして、1ヶ月間、アプリを開かずに放置。そのあと起動して、更新されるかどうかも確認しました。
結果は意外なほど頑固でした。iPhoneもAndroidも、ホーム画面のアイコンは古いまま。何度開いても変わらず、ホーム画面から削除して追加し直したときに新しいアイコンが反映されました。
一方、PCでは挙動が違います。アプリを開くと更新がある旨の案内が出て、更新できました。この違いが、今回いちばん面白かったところです。
実験で何を変更したのか
今回調べたのは、同じPWAとして扱う設定を保ったまま、アイコン画像だけを差し替えた場合です。
PWAには、名前やアイコン、起動先などを指定するWeb App Manifestがあります。iconsはホーム画面などで使うアイコン画像の候補を指定する項目で、idはインストールされるWebアプリを識別するための項目です。
もしidまで変更してしまうと、単純なアイコン更新とは別の話になります。そこで今回はidを変更せず、アイコンだけをOJappからOJapp PROへ切り替えました。
この条件で知りたかったのは、次の3点です。
- インストール済みのスマホのアイコンは、放置していれば更新されるのか
- 更新されない場合、アプリを起動すると変わるのか
- スマホとPCで更新の扱いに違いがあるのか
アプリを入れ直せば新しいアイコンになるのは想像できます。知りたかったのは、すでにホーム画面に置かれているアイコンがどうなるかです。
1ヶ月、開かずに放置してみた
まずiPhoneとAndroidで、OJappのアイコンをホーム画面に追加しました。その後、サイト側で使うアイコン画像をOJapp PROのものへ変更します。
変更直後にアプリを開くと、起動したことが更新のきっかけになるかもしれません。そこで今回は、あえて触らずに1ヶ月待つことにしました。
ホーム画面には毎日アイコンが見えています。新しい画像に変わっているかどうか、確認するだけならアプリを開く必要はありません。
しかし、1ヶ月経っても見た目に変化はありませんでした。
iPhoneもAndroidも、追加したときのOJappアイコンがそのまま残っていました。 サイト側で画像を変えたことは、少なくとも今回のホーム画面の表示には反映されていません。
1ヶ月待った意味があったのか、なかったのか。結果としては「変わらない」を確認するために、しっかり1ヶ月使いました。こういう地味な実験ほど、結論が出るまで長いんですよね。
その後、何度起動しても変わらなかった
次は、ホーム画面からPWAを起動してみます。
更新のタイミングが起動時なら、ここで新しいOJapp PROアイコンに切り替わるかもしれません。ところが、起動後もホーム画面のアイコンは古いままでした。
一度だけの結果ではありません。その後も何度か起動しましたが、iPhone・Androidともにアイコンは変更されませんでした。
ここで確認できたのは、ページを開いて新しい内容を表示できることと、OSがホーム画面に保持しているアイコン画像が更新されることは、同じ動作ではないという点です。
Webページの中身を更新できたからといって、ホーム画面に置いたアイコンまで連動して変わるとは限りません。今回の実験では、まさにそこが分かれました。
削除して再追加すると、新しいアイコンになった
最後に、ホーム画面にある古いアイコンを削除して、同じページをもう一度ホーム画面に追加しました。
すると、今度は新しいOJapp PROアイコンが表示されました。
つまり、変更後のアイコン画像が使えない状態だったわけではありません。新しく追加する場合には新しい画像が使われるのに、すでに追加済みのアイコンは更新されなかったということです。
この差は実際の運用でも気になるところです。ロゴを変更したり、季節限定のアイコンに切り替えたりするつもりで画像を差し替えても、既存ユーザーのホーム画面では古い見た目が残ることがあります。
今回のiPhoneとAndroidでは、再追加が新しいアイコンを反映する方法になりました。ただし、再追加は利用者の操作が必要です。サイト運営者が画像を更新するだけで、全員のホーム画面が一斉に切り替わるような挙動は確認できませんでした。
PCでは「アップデートがあります」と表示された
ここでスマホとは違う結果が出たのがPCです。
PCのPWAでは、アプリを開くと更新があることを知らせる案内が表示され、更新操作ができました。 iPhoneとAndroidのように、古いアイコンが残ったまま何度開いても変化がない、という結果とは異なります。
今回の結果を並べると、次のようになります。
| 確認したこと | iPhone | Android | PC |
|---|---|---|---|
| アイコン画像変更後の反映 | 変わらず | 変わらず | 更新案内が表示された |
| 1ヶ月放置 | 変わらず | 変わらず | 今回の放置検証の対象外 |
| その後の起動 | 何度開いても変わらず | 何度開いても変わらず | 更新操作が可能 |
| 削除して再追加 | 新しいアイコンになった | 新しいアイコンになった | 再追加は不要だった |
PCで表示された更新案内は、スマホにも同じように出るものではありませんでした。PWAという共通の呼び方でも、インストール後の管理方法まで完全にそろっているわけではないと実感します。
なお、PCの結果は更新案内を確認して操作できたという実測です。すべてのPCブラウザで同じ通知が出る、という意味で書いているわけではありません。今回の比較で大切なのは、実際に使った環境でスマホとPCの挙動が分かれたことです。
PWAのアイコン更新を前提にした運用は考え直したい
この実験から、自分の中ではひとつ判断が固まりました。
スマホのホーム画面アイコンは、サイト側で画像を差し替えれば更新されるものとして設計しない方がいい。
特にOJappのように、Webページをホーム画面の入口として使う仕組みでは、アイコンは単なる飾りではありません。利用者が毎日タップする目印です。そこに表示される画像が、サイト側の最新設定とずれていても不思議ではない、という前提で考える必要があります。
一方で、今回の結果はPWAそのものの更新が止まったという話ではありません。確認したのは、ホーム画面に表示されるアイコン画像の更新です。ページの内容や別の機能の更新まで、同じ結果だったとは扱いません。
idを変えなかったこともポイントです。アプリの識別を変えずに画像だけ変更しても、スマホ側の既存アイコンはそのまま残りました。Manifestの記述を変えることと、インストール済みアイコンの表示が変わることを、分けて考えられる実験になりました。
まとめ：スマホは再追加、PCは更新案内が出た
今回のOJappアイコンからOJapp PROアイコンへの変更実験では、iPhoneとAndroidは1ヶ月放置しても変わらず、その後何度起動しても変わりませんでした。削除して再追加すると、新しいアイコンが表示されました。
PCではアプリを開いたときに更新案内が出て、更新できました。
同じPWAでも、ホーム画面に置いたあとのアイコンの扱いには、はっきりした違いがありました。
PWAのアイコンを設定するときは「追加した瞬間にどう見えるか」だけでなく、「追加されたあと、変更したらどうなるか」まで考えておきたいところです。
1ヶ月待って得られた結論はシンプルでした。スマホのアイコンは、想像以上にしぶとい。
