react nativeとflutterの比較

9月 23, 20229月 30, 2022

React Nativeについてはexpoを利用していることを前提にしています。
expoは開発をスムーズにするツールであり、Expo Goというアプリで実機テスト動作を簡単にできるなどのメリットがあり、React Nativeの開発でexpoを使わないで開発するなどは考えられないです。

Javascript 対 Dart

React NativeはJavascriptという言語で記述します。これに対して、FlutterはDartという言語で記述します。
では、JavascriptとDartではどちらが簡単か？ということに対してですが、個人的にはJavascriptの方が1.5倍くらい簡単だと思います。

ホットリロードについて

これはReact Nativeに軍配が上がります。
expoを利用していれば、react nativeの方が全然スムーズです。AndroidとiPhoneを同時にホットリロードしてどちらから操作しても快適に動作します。
これに対して、flutterはホットリロードされていない場合があり、最初はストレスを感じました。また、保存などの一部の機能が、一つのシミュレータからしか操作できなくて、なぜ保存できていないのか、などのFlutterの癖を理解するのに苦労しました。

過去の資産について

react nativeの場合javascriptなので、javascriptで利用されてきた過去の資産の知識がそのまま使えるのがメリットです。typescriptやjestやeslintなどの知識がそのまま使えるので学習する内容が少なくてすみます。

このようなメリットがあるにもかかわらず、react nativeよりもflutterの方が人気が出ているのはなぜかということが気になります。

react nativeのデメリット

エラーの内容が分かりにくい。エラーを調べ出すと、stackoverflowをじっくり調べないと、解決しないようなエラーと戦うことになる。
しかし、これはプログラマーとしては当然の作業で、これができないのならSEとは言えないと思う。

react nativeを選択するメリット

React はWebで最も支持されているフロントエンド

・React Nativeを勉強すれば、Web開発でReactを使う場合の障壁を減少させてくれます。

React Nativeはタグで表示コードを作成、Flutterは関数で作成する

react nativeは、render()関数の中に、タグでhtmlを書くように記述することができて、分かりやすい(jsx)。<Text>のタグを多用することになるが、htmlベースの理解で書いていけるので、分かりやすい。
これに対して、flutterはウィジェットを配列にして追加していくと表示されるのが分かりにくくて、ダサい気がする。(でも、flutterは人気だし、flutterの方が良いに違いない。)

react nativeの方がログが見やすい

expoを利用していれば、ログがターミナルに出るので、シミュレータの脇にターミナルを置いて、ボタンを押した時の動作のログを監視するのは、React Nativeの方が10倍くらい楽な気がする。(いや、でもflutterは人気だし、flutterの方が良いに違いない)

React nativeの方がコードの再利用がしやすい

・これは慣れなのかもしれない。が、コピペして貼り付けという作業はReact Nativeの方が初心者には分かりやすいと思う。

React Nativeの一番のデメリット

・自分が思うにビルドのエラーが難しいことだと思います。これに時間がかかる。ExpoのEAS Buildなどをする必要が出てくると、さらに苦労します。この点、Flutterはビルドのエラーの解消はReact Nativeに比べると楽みたいです。

react native派からのflutterのデメリット

・ネストがとても深くなって分かりづらいです。なので、Flutterを勉強し初めて、自分はダサい言語だなと、正直思いました。

・flutterは簡単だと言われているが、Providerとか割と難しいと思う。Reactの方がサクサク身についた。(なんせJavascriptだし)

Flutterが変えた常識

・「Webサイトを作るにはJavascriptが絶対に必要」と思っていたのだが、Flutter(言語はDart)でWebサイトが作れる模様。全て、DartだけでWebサイトが作れるのかは、まだ勉強中だが、少なくとも「Webサイトを作るにはJavascriptが絶対に必要」という考え方は変えた方がいいと思う。

スピード

Flutterの方が動作が少しはやい。ただ、言われないと気がつかないレベル。React Nativeが若干遅いのは、レイヤーが一つ多いかららしい。

プログラマーは流行を追う方がメリットがある

流行を身につけないと、話題に入れない。流行を追えないと頭が悪く思われる。などの無言のプレッシャーが気にならないかどうか。

結論

両方とも優秀です。javascriptの経験と職歴をつけたいのであればReact Nativeを勉強し、流行が好きなのであればFlutterを勉強すれば良いと思います。