基礎知識

クロスプラットフォーム開発とは。Flutter・React Nativeの比較と選び方

iOSとAndroidを別々に作るのではなく、1つのコードから両方を作る方式があります。開発量を抑えられる一方、制約もあります。この記事では、選択の判断材料を整理します。

何をする技術か

クロスプラットフォーム開発とは、1つのコードから、複数の環境で動くアプリを作る方式です。

通常なら、iOSはSwift、AndroidはKotlinで別々に書く必要があります。これを1回書けば両方で動く形にするのが、この方式の目的です。

利点は明確です。開発量が減り、修正も1か所で済み、機能の差異が生じにくくなります。

一方で制約もあります。各OS固有の機能を使う場面では、追加の作業が必要になります。また、新しいOSの機能への対応は、枠組み側の対応を待つことになります。

FlutterとReact Native

主要な選択肢は2つです。設計思想が異なります。

Flutter。Googleが開発。Dartという言語を使います。画面の描画を自前で行う方式で、両OSで見た目が完全に揃います。動作も安定しやすい設計です。

React Native。Metaが開発。JavaScriptとReactの知識をそのまま使えます。各OS本来の部品を使って描画するため、その環境らしい見た目になります。

選択の基準は、既存の技術資産です。Web開発でReactを使っているなら、React Nativeは学習の負担が小さくなります。

見た目を完全に統一したい場合はFlutter、各OSの作法に沿いたい場合はReact Nativeという傾向もあります。

向く案件

この方式が適する条件を整理します。

• 画面表示とデータ取得が中心／一覧、詳細、入力、送信という構成
• 予算が限られる／2つ分の開発費用を出せない
• 両OS同時に出したい／片方だけ先行させたくない
• チームが小さい／iOSとAndroid両方の技術者を確保できない
• 改善を速く回したい／1か所の修正で両方に反映される

多くの業務系アプリや情報提供型のアプリは、この条件に当てはまります。実際、社内向けアプリやサービスの補助的なアプリでは、採用が一般的になっています。

向かない案件

逆に、適さない場合もあります。

端末機能を高度に使う。カメラの細かい制御、センサーの継続的な利用、映像や音声の処理。ネイティブのほうが確実です。

性能が最優先。ゲーム、リアルタイムの描画。処理の層が1つ増えるため、限界があります。

OSの最新機能をすぐ使いたい。新機能への対応は、枠組み側の実装を待つ必要があります。

片方のOSだけで完結する。そもそも共通化する必要がありません。

判断の目安は、端末の機能をどれだけ深く使うかです。ここが浅ければ共通化で足ります。

導入時の注意点

採用を決める前に、確認すべき点があります。

結局ネイティブの知識が要る場面がある。各OS固有の設定、権限の扱い、ストアへの申請。完全に隠蔽されるわけではありません。

枠組みへの依存が生じる。提供元が方針を変えれば、影響を受けます。長期に運用するシステムでは、この点を検討する必要があります。

不具合の原因が特定しにくい。アプリ側の問題か、枠組み側の問題か。切り分けに時間がかかることがあります。

技術者の確保。ネイティブ開発者より母数が少ない場合があります。

これらは欠点というより、把握しておくべき前提です。

費用の目安

共通化により、どの程度費用が変わるかを整理します。

単純に半分になるわけではありません。設計と検証は両OS分必要で、OS固有の対応も残ります。

実務的な感覚としては、ネイティブ2つ分を100とすると、共通化で60〜75程度という見方が一般的です。

保守段階での差はより大きくなります。修正が1か所で済むため、長期の運用費用では効果が出ます。

ただし、後からネイティブへ移行する場合は作り直しに近い作業になります。この可能性がある場合、初期の判断が重要になります。

エンジニアとしての位置づけ

この技術を扱う人材について整理します。

需要は増えています。予算と体制の制約から、共通化を選ぶ企業が増えているためです。

求められるのは、枠組みの知識に加えて、両OSの前提を理解していることです。共通化しても、OS固有の事情から逃れられる場面は限られます。

Web開発からの移行がしやすいのも特徴です。React Nativeであれば、Reactの経験がそのまま活きます。

単価は月額65〜95万円の範囲が中心です。ネイティブと大きな差はありませんが、両OSを1人でカバーできる点が評価されます。この数字は民間各社の集計で、公的統計ではありません。

性能の実際

共通化した場合の性能について、具体的に整理します。

多くの業務アプリでは、体感できる差はありません。画面の表示、一覧のスクロール、データの取得。これらは十分な速度で動作します。

差が出るのは、描画の負荷が高い場面です。複雑なアニメーション、大量の要素を同時に表示する画面、映像の処理。

起動時間にも差が出る場合があります。枠組みの読み込みが加わるためです。

判断の目安は、利用者が待つ場面があるかどうかです。業務で使うアプリなら、わずかな差は許容されます。消費者向けで競合が多い場合は、影響が出る可能性があります。

不安がある場合、試作して実機で確認するのが確実です。

体制と学習

採用する場合の、チーム面の検討事項を整理します。

1つの技術で両OSに対応できるため、人員を集約できます。iOSとAndroidで別々の担当を置く必要がありません。小規模なチームでは大きな利点です。

ただし、ネイティブの知識が不要になるわけではありません。OS固有の設定、権限、ストアへの申請。どこかで必要になります。

学習の負担は、既存の技術によります。Reactの経験があればReact Nativeは近く、そうでなければFlutterのほうが学びやすいという見方もあります。

技術者の確保について。ネイティブ開発者より母数は少なくなりますが、Web開発者からの移行が比較的容易なため、育成の選択肢はあります。