mottox2 blog

PWA BeginnersでPWAで戦えそうなシチュエーションについてLTしてきた

mottox2
mottox2
2018/05/26

5/24にPWA Beginners #4で「ネイティブアプリの代わりにPWAで戦う選択肢」というタイトルでLTをしてきました。基本的にPWAはネイティブアプリの代わりにはならないと思っているなかで、どういったシチュエーションでネイティブアプリの代わりになるのかを検討してます。

https://speakerdeck.com/mottox2/pwa-instead-of-native

Progressive Web Apps

最初に言っておくと前提としてPWAはネイティブアプリの代わりにはならないという見解はほぼ多くの人が思っていると思っていて、僕もそう思っています。
PWAはReliable, Fast, Engagingな特徴を持つものである。ということで、基本的にはWebAppでもよりよい体験を提供していこうという認識が近いと思っています。

Progressive Web Apps  |  Web  |  Google Developers

Progressiveが示すとおり段階的に対応できるという話ではありますが、WebエンジニアとしてはNativeアプリを代用できるか?という可能性を探りたいものです。
銀の弾丸にはなりませんが、条件が揃えばネイティブアプリとは違った選択肢になりうるのではないか?という気持ちからこのLTをしようと思いました。

今、PWAをアプリライクに使おうとすると発生する問題

  • ブラウザ対応がいまいち
    • Google、Microsoftは前向き、Appleの対応は不透明
    • 今後サポートしても、バージョンによって使える機能・細かい挙動が変わる可能性が高い
    • 現状でもiOS SafariとGoogle ChromeでWeb App Manifest周りの挙動が異なる。
  • Webページが遅いと、圧倒的に体験がネイティブアプリと比べて劣る
  • アプリストアを使えない
    • GooglePlayはサポートする方向に動いているが、AppStoreは正直期待出来ない。
  • インストール動線
    • 一般的ではないので、入れてもらうのにハードルがある。
  • オフライン対応などでキャッシュ戦略など考えることが増える

もちろんProgressiveが示すように、既存サイトにServiceWorkerを入れてアセットをキャッシュすることや、Android端末向けにWeb Pushを入れる、Payment Request APIで決済機能を利用するなどPWAの一部機能を使用するだけなら上のような問題は考える必要はありません。あくまで、ネイティブアプリで戦わずPWAで戦うという選択肢をした場合です。

補足:ただ基本的にPWAは通信環境が悪い国向けに、通信量をへらすという文脈での提供が多くこの用途では日本は対象になりません。ネイティブアプリもあるけどPWAも用意しているというのが主流だと思います。 (例: Instagram, Twitter Lite)

どういう時にPWA Orientedがよさそうなのか

ストア(AppStore, GooglePlay)の意向に振り回されたくない限り、予算・人材が確保できるなら基本的にネイティブアプリでやっていくといいと思っています。
ただ、予算・人材が確保出来ない中でネイティブアプリを作っているなら、「そもそもネイティブアプリは必要なのか?」「工数を食い合ってしまい中途半端なものにならないか?」みたいなところがポイントで、iOSユーザーにはリーチが弱くなるけどPWAでWebに注力していこうという選択はありな気がしています。

採用できない

他の事業部とかなくてiOSの経験者がいない場合、成果物がないので募集をするのも大変ですいし、採用する際も難しいでしょう。iOSを立ち上げるだけの力を持ったエンジニアを見つけるのは難しいでしょう。(メガベンチャーに吸い取られ続けてる中で、あなたの会社にはいる優位性を見いだせますか?)

そこで、今いるメンバーの中でPWAだけではなくReactNativeなどのAlternativeな選択肢をやりたい人を見つけて進めてもらう方が現実的な場合が多いのではないでしょうか。
(ただ、多くの場合かなりのレベルアップを必要とすることが多いので押し付けにならないようにしたい)

予算がない

予算がないならスコープを狭くするとか開発期間を長くするとか検討してほしい。

ストアの都合

アダルト系のアプリ(Google Playも厳しい)やApp Storeで多い謎のリジェクトなどに振り回されたくない。IPhoneXの画面対応や64bit対応でストアから追い出されるなど、そういったものから自由になりたいなど。
ただ、アプリの性質上、ストアに出せるものならストアに出しとくといいんじゃないかと思ってます。

MVPを作りたい

提供する上で本当に価値があるのか、MVP(Minimum Viable Product)を作って確かめたいという場合もPWAが有効だと思っています。
ストアの申請(AppStoreだと数日、GooglePlayだと数時間)に振り回されず高速にフィードバックループを回せるのはWebの利点です。そこでネイティブアプリを模した体験をしてもらうというのは一つの選択肢になりうるかもしれません。

意思決定ができる

これらのメリットがあってもRead Worldで重要なのは、PWAのデメリットを把握した上で、進めていくという意思決定です。「やっぱりiOSも」なども言い出すと現場のエンジニア的には非常にしんどいです。
ただ、予算・人材がない時点で導入の判断が出来て成功するころには、技術者のレベルが上がって他社の技術者にとって魅力的な環境になるかもしれませんし、成功してお金があれば人材確保も楽になりますし、広告で勝負もかけられます。また、時間が立つとPWAが普及していて、アーリーアダプターになっている可能性もあります。

まとめ

銀の弾丸ではない。使い方次第でネイティブアプリよりベターな選択肢になりうるというところ。
現状、予算・人材が確保できるなら基本的にネイティブアプリかと思っている。ウェブエンジニアができるとう点でReact Nativeもありだと思っています。
PWAはもう少しブラウザ対応(というかAppleの意向)がわかるまでは、尖った意思決定が出来ない場合は積極的に進めづらいと感じています。

ユーザーに対して、エンゲージメントをどう上げていくかという選択肢にWebが上がってくるので個人的に非常に嬉しいと思っています。PWAはネイティブアプリライクに作るだけでなく、基本的には既存サイトの体験をよくしていくためのツール群だと思っているので、うまく使ってWebの体験を改善していけたらと思います。

PWA Begineersの運営の皆さん、LTの機会を頂きありがとうございました。

@mottox2フリーランスWebデベロッパー

都内でフリーランスエンジニア・デザイナーとしてWebサービスやスマホアプリを作っています。Ruby on Railsでの新規事業の爆速立ち上げや、使いやすいSPAの開発が得意です。

お問い合わせはこちら

自分のGitHubから読み取る挫折の歴史 in 2018

この記事は、「Crieitアドベントカレンダー」9日目の記事です。遅刻ごめんなさい。 Crieitはプログラマー・クリエイターのためのサイトなので、自分のクリエイターになろうとして失敗した記録をG

Netlify Functions + TypeScriptのボイラープレートを作った

8月に書いた「Netlify FunctionsでTypeScriptを使う」という記事で、netlify-lambdaをフォークしてTypeScriptを使っていると書きました。 数ヶ月経ち、フォ

netlify

Netlify FunctionsでTypeScriptを使って開発する

この記事は既に内容が古くなっています。最新の内容は「Netlify Functions + TypeScriptのボイラープレートを作った」をご覧ください 先日Netlify Functionsの

netlify

技術ブログを支える技術(Gatsby + esaio)

2018年5月に公開を始めた当ブログですが、Gatsbyをより多くの人に使ってもらいたいと考えソースコードをオープンにしたので、ブログで用いている技術について説明します。 > 当サイトについて当サ

esaiogatsby