【第一回】PickUpDagashi

この記事は

こんにちは、現在大学四年生で4月から新卒としてAndroidエンジニアになるみっちゃんと申します。

Androidエンジニアとしてもっと新しい情報をキャッチアップしていかないとダメだなぁという気持ちがあり、そんな時にAndroid Dagashiに出会いました。

Android Dagashiでは毎週日曜にすごいひとたちがAndroidの新しい情報に関する記事をピックアップしてまとめてくれています。つまりこれを読めば、androidの最新情報を簡単にキャッチアップできるのです！

だがしかし！！！
だがしむずかしい！！！

Android Dagashiでピックアップされている記事がムズすぎて全部読めない...
私が無力なばっかりに...

しかし、諦めたらそこで成長は止まります。
全部読めないなら気になる記事を１つだけピックアップして、
なんとしてもそれだけは理解すれば良いのです。

ということで、この記事では
私がAndroid Dagashiから一つだけ記事をピックアップして読み、理解し、
そして私のような初心者のAndroiderもしくはモバイルアプリ開発者が読むと仮定して、
「誰でも理解できること」を目的として内容をまとめます！

毎週継続してやっていきたい 強い気持ち で第一回を始めます。
よろしくお願いします！！

今回のピックアップ記事

今週は、2022-03-06の記事の中から何かしらピックアップして読むことにします。
読んで、わからない内容を質問して理解して文章にするので基本的には一週間くらい遅れて記事を出すことになりそうかも〜です

ということで、
今回のピックアップ記事は。。
PWA vs. Flutter vs. React Native vs. Native
です。

PWA vs. Flutter vs. React Native vs. Native

和訳：PWAとFlutterとReactNativeとネイティブアプリを比較してみた

概要

この記事は、Androidアプリに関する記事というよりは、昨今ひいては今後のモバイルアプリ開発の行方に関する内容です。

PWAとは？

皆さんはPWAをご存知ですか？
私は最近知ったのですが、PWAとはwebアプリをネイティブアプリっぽくスマホのホーム画面に追加できるやつのことだそうです。

実は、QiitaもPWA対応がされており、実際にQiitaのモバイルアプリはないものの、モバイルアプリっぽくホーム画面に追加することが可能なのです！

しかもインタフェースもモバイルアプリそのもの！！

いや〜、こんなの出てきたら我々ネイティブアプリエンジニアの立場が危ういのでは..？、と思いません？
思いますよね。そういう方のための記事となっております。

多分タイトルの中で一番疑問なのはPWAかなと思ったので説明しました。

ちなみに、

• FlutterやReactNative = ウェブもスマホアプリもハイブリッドに開発可能
• ネイティブアプリ = iOSならswift/obj-c、AndroidならKotlin/Javaを使って開発。基本的にはスマホアプリのみに対応

みたいな感じです。

内容

はじめに

2019年3月に公開された記事では
「PWAはネイティブ開発の終焉を意味するのでは？」
という問いに対して、
「No」
という回答がされていました。

まぁ正確には、
「PWAは時に素晴らしい解決策にはなり得るが、多くの場合、ネイティブまたはFlutterなどのハイブリッド開発がまだ必要である」
というものでした。

それから2年、AndroidではPWAの能力が上がり続けているが、iOSではそれほどでもなく、
一方でハイブリッド開発（特にFlutter）も大きく発展しています。

モバイル開発の現状は今どうなっているのか？
また、これからアプリを開発するのに最適なテクノロジーは何なのでしょうか？

ここでは、ニーズや状況に応じて最適な選択するためのガイドをご紹介します。

対立する4つの技術

どの技術も他の技術に比べて優位に立てる分野をいくつかリストアップしてみましたので、
それを見ていきましょう！

• 開発期間
  ネイティブ開発はハイブリッド開発の2倍の時間がかかる
  PWAはハイブリッド開発よりもさらに短期間
  つまり、開発にかかる時間は PWA < ハイブリッド < ネイティブ となる。

• 開発コスト
  開発者の給与的な話。
  コストが高いランキングは以下の通り

1. Flutter (dart)
2. React NativeとNative (Swift & Kotlin)
3. PWA(ウェブ)

理由は、
Flutterの開発者が少なくて希少価値が高いこと
モバイルアプリ開発者に比べてウェブの開発者は多いこと
ですね。

• セキュリティ
  あまり正確な比較はできないが従来的にはネイティブアプリ開発の方がセキュリティが高いらしいです。

セキュリティを維持するにはソフトウェア開発キットやフレームワークなど、すべてを最新の状態にすることが常に重要です。ですから、依存関係は少ないほど良いのです。

それを考慮すると、React NativeやFlutterの場合、それらのフレームワークの実装で余計なレイヤーが増え、リスクが発生します。また、PWAの場合はブラウザという余分なレイヤーもありますし、一般的にモバイルアプリケーションよりもウェブの方がハッカーに狙われやすいです。

一方ネイティブアプリの場合は、スマートフォンとアプリ開発者の間にあるのはOSのSDKだけであり、この点ではセキュリティが高く感じられます。

しかし、ネイティブ開発でもある機能のために外部SDKを導入すれば、先の理論は覆ることになってしまいます。

なので、なんとも言えない。。

• パフォーマンス
  結論： Native > Flutter > React Native
  またPWAに関しては、サービスワーカーによって読み込み時間が短縮されたとしても、アプリのダウンロード時にほとんどのコンテンツがすでに読み込まれているネイティブアプリケーションと比較すると、パフォーマンスはまだ良くありません。

ちなみに、サービスワーカーとは
Webページの裏側で動かせるイベント駆動のJavaScript環境で、
これを使うと、Webアプリケーションでも、ネイティブアプリ的なユーザー体験を提供することが可能です。
詳しくはこちら：Service Workerとは

パフォーマンスというのはモバイル開発者だけでなくバックエンド開発やデザイナーさんにも依存することになるので、アプリ開発において十分考慮すべき項目であるという認識をしましょう！

• UI/UX
  やっぱこれに関してはネイティブがイチバン！

React Nativeでは、基本的なナビゲーション機能がまだ不足していたり、開発が複雑らしいです。

Flutterでは、ネイティブのデザインガイドライン（Androidはマテリアルデザイン、iOSはヒューマンガイドライン）に準拠するなど高いパフォーマンスを実現するための特別な取り組みが行われており、シンプルなUIで基本的な画面のままであれば、ネイティブに近いUI・UXを実現することができます。

PWAの場合ネイティブアプリケーションで使用されているクラシックなアニメーションがないため、アニメーションにおいては若干の「Webみ」(?)が否めないらしい。

• バッテリー消費
  ネイティブアプリケーションはアプリケーションのダウンロード時に多くのデータを保存するため、アプリケーションを開くたびに再ロードするデータが少なくなり、PWAよりもネイティブアプリケーションの方が明らかに有利になります。

またハイブリッドとネイティブを比較した場合だと、ほとんど同じではあるものの、
わずかにハイブリッドの方が処理が長いため、ネイティブが有利。

• アプリサイズ
  結論：PWA > Native > Hybrid

PWAはそのサイズを自動的に管理できます。
例えば、しばらく使用されないと、キャッシュがクリアされ、無駄なデータがお掃除されます。

ハイブリッドアプリは、アプリにハイブリッドフレームワークが含まれるため、
ネイティブアプリよりも容量が大きくなります。
実例として、AirbnbのエンジニアがReact Nativeを外したなど。

• アプリとの出会いやすさ
  ユーザーがアプリを見つけるのは簡単かどうか、という話です。

ネイティブアプリやハイブリッドアプリの場合は、まったく問題ありません。
作成したアプリは、Androidの場合Google Play Storeで、iOSの場合App Storeで公開できるので、ユーザーはそこにアクセスすれば簡単にアプリを見つけることができます！

PWAの場合、Androidは見つけやすいらしいです。
webサイト上にインストール用バナーがポップアップ表示されるとのこと。
ユーザーがPWAアプリを発見できるように工夫されてますね。

一方、iOSの場合はそのような工夫がない。
またインストールも1クリックではできないので結構めんどくさいようです...。

• モバイル端末の各機能へのアクセス
  モバイルアプリにおいて重要なことの一つに、スマートフォンのすべての機能にアクセスできるかどうか、というのもあります。

当たり前ですが、ネイティブ開発では、スマートフォンのすべての機能を利用することができます。

ハイブリッドの場合もスマートフォンの全ての機能にアクセスする方法は提供されているようですが、
場合によってはネイティブアプリの場合より実装が遥かに複雑になる可能性があります。

PWAの場合、機能はブラウザアプリケーションが持っているアクセスに連動しています。

Android端末では、例えばChromeでほとんどの機能を利用できます。

iOSデバイスの場合、SafariだけがPWAをインストールすることができます。
そして2020年、Safariチームはブログ記事を公開し、セキュリティ上の理由から一部のAPIは実装されないと述べています。

つまり、プッシュ通知やBluetoothなどの利用は厳しいようです。

• オフラインモードの実装
  モバイルアプリケーションの重要な機能の1つに、「オフラインモード」があります。
  つまりネットワーク接続が不十分な場合や全く接続できない場合にもアプリケーションをできるだけ使用できるようにすることが重要です。

ネイティブアプリケーションやハイブリッドアプリケーションでは、データを保持するために、
例えば、実装とメンテナンスが大変ですが、非常に堅牢なSQLデータベース管理などで解決できます。

一方、PWAの場合は、Service Workersの力を借りて、オフラインモードが最初から搭載されています。

実装におけるコストを比較すると若干PWAが優位となりますね。

• 技術的な安定性
  今アプリを開発した場合、5年後にどのような挙動を示すでしょうか。

ネイティブアプリの場合、エコシステムは非常に安定しています。OSは年に何度か変更があり、新しいバージョンの開発が必要になることもありますが、オリジナルのバージョンから2〜3年経っても機能しているのが普通です。

React Nativeの場合、フレームワークを改良する開発者のコミュニティに依存しているため、多くの破壊的変更が存在します。アプリは頻繁に更新する必要があり、そうしないと将来のOSバージョンでアプリが動作しなくなる可能性があります。

Flutterの場合、フレームワークの進化はGoogleによってコントロールされているようですが、まだ非常に若いので、今後数年間で多くの破壊的変更が予想されます。

PWAの場合、コミュニティが圧倒的に大きくても、開発者はブラウザの開発者とその進化に依存することになります。例えばiOSでは、もう何年も前から期待されているにも関わらず通知機能がいつ開発されるかは分からない状態です。つまり、不確実性が多くあるようです。

• アプリのアップデート
  PWAはコンテンツの更新が非常に簡単ですが、一方でネイティブアプリではリリース作業には多くの工程が含まれます。

例えば以下のような工程です。
開発 → パッケージファイル（Androidは.apk、iOSは.ipa）の作成
→ ストアにアップロードする
→ 検証を待つ
→ 認証されたら公開する
→ ユーザーがアプリをアップデートするのを待ちます。

結論

• PWAがいい時

  • AppStoreに公開しない時
  • 特定の機能(iOSのpush通知など)を必要としない場合
  • ウェブサイト、Androidアプリ、iOSアプリを早く安く提供したい場合

• ハイブリッドアプリケーション(Flutterとか)がいい時

  • デザインがそんなに複雑じゃない場合
  • 機能がそんなに複雑じゃない場合
  • ネイティブアプリによりも安く早く提供したい場合

長期的に見れば、ネイティブアプリケーションの方がはるかに効率が良い。
特に、

• 高性能な機能をユーザーに提供したい場合
• ユーザーが頻繁にアプリを利用する場合
• iOSやAndroidが提供する最新の機能を利用したい場合

この記事を読んだ感想

やっぱネイティブしか勝たん！

とは言いつつ、やはりモバイル開発者として色々な技術に関する知識を深めていきたいですね。

でもでもandroidすらまともにできないから...まずはAndroidを頑張ります...

はぁ。勉強しないといけないこと多すぎる〜〜〜。