読み続けて: Flutter と React Native: 現在、どちらが最良でしょうか。

**3. Flutterアプリ開発**

Flutterでアプリケーション開発会社として、このフレームワークはクロスプラットフォーム開発を次のレベルに引き上げると信じています。そして、Flutterの定義、Flutterでアプリケーション開発することの利点、ITコミュニティの全員が常にFlutterについて議論している理由を調べてみましょう。

![image]( https://d50cmv7hkyx4e.cloudfront.net/wp-content/uploads/2021/06/19124938/6t1pv3xcd-1024×512.jpg)

*Flutter はクロスプラットフォームです*

[Flutterは]( https://flutter.dev/)Googleによって開発され、2015年に最初に紹介された **SDK – Software Development Kit** (ソフトウェア開発キット)です。SDKとフレームワークの間によく間違えている人がいます。基本的に、フレームワークは事前に作成されたライブラリであり、自分のコードを追加するだけで、アプリケーションが活動できます。逆に、SDKはライブラリ、フレームワークと他のツールを含む、はるかに広い概念です。

FlutterはGoogleによって開発された[Dart]( https://dart.dev/)言語に基づいて開発されています。もともとはウェブアプリケーションを構築するために作成されましたが、その後、著しい成長で、モバイルとデスクトップにも使用されています。Dartはオブジェクト指向言語なので、このオブジェクト指向言語から他の同様の言語に切り替えるのがとても順調に実行します。Flutterの 構造を深く掘り下げてみましょう。

当初、Googleは階層化と拡張可能なシステムとしてFlutterを見せてました。以下の3つの構造あります。

* **Embedder**

* **Engine**

* **Framework**

![image]( https://d50cmv7hkyx4e.cloudfront.net/wp-content/uploads/2021/06/19124941/flutter_architecture-1024×840.png)

*Flutterのアーキテクチャ*

各レベルは特殊な言語で書かれています。EmbedderでnativeテンプレートにCross-platformアプリケーションをカプセル化するので、プラットフォーム固有の言語を使用しています。(Androidの場合はJava、iOSの場合はSwiftとObjective-C、LinuxとWindowsの場合はC++)。Engineの言語はCまたはC++です。目的は、Flutterの低レベルAPIを相互に接続することです。FrameworkはDartに基づいています。各レベルがどのように活動するかを詳しく見ていきましょう。

**Embedde** は最も基本的なレベルです。**Embedder**がないと全体Cross-platformの概念が破壊されます。**Embedder** でどのオペレーティング・システムでもアプリケーションが起動されます。イベントループ、インプット、アクセシビリティと他のサビースなど多くのサビースへのアクセス権を提供します。Embedderで既存のアプリケーションのコードにFlutterコードの一部を入れることができます。このフレームワークのembedderの機能はFlutterでアプリケーション開発の最大の利点の一つです。

**Engine** はFlutterの心臓部です。ここで、プロセスの大部分が活動します。以下のことを担当します。

* **Graphics (rasterizationを含む)。**

* **Input/Output。**

* **サブシステムのRender。**

* **Plugins。**

* **アプリのアクセシビリティ。**

* **Dartのコンパイラとランタイム。**

各プロセスでは、**Engine** は**dart: ui**というDartライブラリを使用します。

**Skia graphics** はグラフィックス表示を担当するEngineです。これは**Flutterの主な利点の一つです**。これはC++で記述されているopen-sourceです。高速でスムーズなアニメーション(60fps以上)を描画できます。この2Dライブラリには、多くのプラットフォーム固有のAPIが含まれています。**Skiaは、Google Chrome、Android、Mozilla Firefox**と**他のアプリケーション**で**使用されます**。

ほとんどの処理タスクはFlutterレベルで動作します。アニメーション、インタラクション、レイアウトなどを操作できる多くのライブラリが含まれています。**Flutterの各Element**は**Widgetです**。これにより、Flutterが非常に柔軟で開発者の意向にとって高度にカスタマイズ可能になります。特に、Flutterは**open-source**なので、最小のコンポーネントのコードを確認して、変更することもできます。

![image]( https://d50cmv7hkyx4e.cloudfront.net/wp-content/uploads/2021/06/19124941/everything_is_widget_in_flutter-1024×512.png) 

*すべてがFlutter Widgetsです*

また、Flutterは**Hot Reload**という機能もあります。**Hot Reload**で、コードを変更した後、アプリケーションを再起動せずに、すぐに確認できます。

その他、Flutterにはで全てのモダンなデザインに合わせる非常に美しいUIが組み込まれています。他の多くのフレームワークでは、UI要素に具体に**state**(状態)を作成してから、前のイベントに基づいて更新する必要があります。ここでの問題は、アプリケーションに何らかの変更があった場合、変更を接続的に監視して、コード全体でインターフェースを更新する必要があります。時々、インターフェースでの不正な変更のため、無関係なコードでもエラーが発生します。

Flutterは問題に対して適切な解決策を提供します。処理コードからインターフェースを切ります。これは、開発プロセスを大幅に削減するため、Flutterの最も重要な利点の1つです。スマートフォンのUIがどのように見えるかを説明するだけで、Flutterが残りの処理を行います。

![image]( https://d50cmv7hkyx4e.cloudfront.net/wp-content/uploads/2021/06/19124940/Flutter-Vs.-React-Native_sl5-1024×534.png)  

*Flutterの長所と短所*

上記の利点以外は、**Flutter**でアプリケーションを開発することは**以下の利点もあります。**

* **高性能アプリケーション。**

* **コードルールは厳密、安全と高度に拡張性があります。**

* **Flutterフレームワークは、さまざまなエラー処理ツールを提供するので、デバッグすることの効果も高くなります。**

上記の利点のため、以下の企業がFlutterを使用しています。

![image]( https://d50cmv7hkyx4e.cloudfront.net/wp-content/uploads/2021/06/19124939/companys_use_flutter-1024×563.png)  

* **Google Ads**

* **Alibaba Group**

* **Reflectly**

* …

Flutterには多くの利点がありますが、まだ**特定の制限**があります。大きな**アプリケーションサイズ**は、おそらくFlutterの最も苛立たしげなことの1つかもしれません。ただし、他のフレームワークにも問題があるはずなので、FlutterとReactNativeの間に違いはありません。けれど、「HelloWorld」アプリケーションの容量が約7MBなら、少し多すぎると思います。

FlutterでiOSアプリケーションを開発することは問題になる可能性があると言う人もいます。理由は、Googleに作成されたので、Androidの方がiOSより良くサポートされています。しかし、そうではありません。

Dart言語には、利点の以外にも制限があります。Dartはまだ新しい言語なので、Flutterを使用する開発者がいるチームを拡張するのは難しいです。明らかに、多くの意欲的な専門家は他の長い間使用されている言語を選択する可能性が非常に高いです。

全体として、このテクノロジーにはいくつかの制限がありますが、Flutterでアプリケーション開発は迅速で、簡単です。そのため、このフレームワークは**2020年に最高のCross-platformアプリケーションフレームワーク**と見なされています。それで、Flutterフレームワークのすべての利点がプロジェクトの品質を新しいレベルに引き上げる可能があるので、流行りに追いつきたければ、Flutterフレームワークは合理的な選択です。

第一部はこちら 第二部はこちら 第三部はこちら

日本のブログ

株式会社INTS  開発部 ハイ.アン