cockscomblog?

cockscomb on hatena blog

Flutterを試した

flutter.io

先日なんとなく物見遊山的にFlutterを試してみた。特に事前の知識もなく数時間で試した程度で、全体に不案内ではあるから、それなりの感想であることを先に断っておく。

(当方はiOS/Androidのネイティブアプリの開発や、Reactを使ったWebフロントエンド開発の多少の経験を有しています)

開発環境

f:id:cockscomb:20180521105915p:plain

IntelliJ IDEAのFlutter開発環境

セットアップ

Get Started: Installにしたがって環境を構築した。Homebrewなどでインストールできるようにしようという動きもあるが、現時点では手でSDKを配置する必要があるなど、少し手間がかかる。経験がないと少し難しいかもしれないが、時間が解決するだろう。

エディタ

IDEとしてIntelliJ IDEADartプラグインFlutterプラグインをインストールした。プラグインのできがよく、筆者は普段からJetBrainsのツールを愛用しているので、それほど調べずにDart 2.0を書くことができた。RunボタンでFlutterアプリを容易に実行できるのは当然として、リファクタリング関連の機能も完全に動作するし、コードを保存した際にdartfmtを呼び出す設定もできた。

Dart 2.0

Dart 2.0は、きちんと学んだわけではないが、書きやすく感じた。言語機能が妙にリッチで、例えばcascade notation (..)や、factory constructorなど、色々な機能がある。Genericsもあれば、pubというパッケージ管理の仕組みもあって、とにかく一通り揃っている。async/awaitの構文とFutureStreamによる非同期処理の手厚いサポートは便利に思う。プログラミング言語としての用途をクライアントサイドのソフトウェア開発に絞ったことで進歩的な機能を取り入れ易かったのだろうと想像する。

Hot Reload

React Nativeでもそうだが、コードを書いたらすぐにアプリに反映されるのは便利である。そろそろ「Hot Reloadは人権」のような言説が出てくる頃合いだと思う。依存するパッケージを追加してもきちんと動くし、画面遷移したあとも遷移先の画面にとどまってHot Reloadが動作するのには驚いた。

Flutter

肝心のFlutterであるが、Reactにインスパイアされた宣言的なUIフレームワークは扱いやすく、好ましく感じた。Reactのcomponentにあたる概念がWidgetで、StatelessWidgetStatefulWidgetをうまく組み合わせて使う。事前に用意されたMaterial DesignもしくはiOSに似せた(Cupertino)スタイルのwidgetを組み合わせると、それだけでもある程度のアプリができてしまう。

FutureBuilderのように、非同期に得られるデータを使ったUIを抽象化してくれるwidgetが特に便利である。非同期処理というのは「状態」に他ならないが、「状態」を宣言的にUIへ反映させられるからこその、宣言的なフレームワークである。直接的にこれと似ているのは、Apollo ClientのQuery componentだろうか。

ReactのようにJSXを使えたらとも思うが、Dartが引数ラベルをサポートしていることや、IDEがコンストラクタの呼び出しの後ろにnew Scaffold(); // Scaffoldというような行コメント風の表示で括弧の終わりを示してくれたりと、工夫を感じる。

簡単なアプリを作っていて、WebView widgetの不在に気がついた。考えてみれば、FlutterはOpenGLでまったく独自にUIを描画しているのだから、WebViewを実装するのは容易なことではない。この点でプラットフォームのUIをそのまま利用しているReact Nativeと大きな違いが生まれている。このトレードオフが今後どのように影響してくるのか、難しいところだろう。

全体的に

少し書いてみたところでは、Flutterはおもしろい。しかしまだバージョンが0.3と若く、未成熟さも感じる。来年に予定されるバージョン1.0のリリースまでには、さらに使いやすくなるだろう。またこのような未成熟さを、コントリビューションのチャンスと捉えることもできる。

Flutterが有効に機能する場面はまだ限定されていると思う。しかしこのような宣言的なフレームワークは業界の最新の流行であるから、学んでみて損はない。

github.com