ざっくり Flutter Forward 2023

Flutter Forward のトップ

2023 年 1 月 25 日に開催された Flutter Forward のざっくりまとめです。 ↓ のリンクから配信のアーカイブが見られます。

https://www.youtube.com/watch?v=zKQYGKAe5W8

アフリカでの Flutter の成長

オープニングではアフリカにおける Flutter の状況が取り上げられました。 ここで気づいたんですが今回の Flutter Forward の開催地はケニアのナイロビみたいですね。

ケニアの経済成長とそれにともなう開発者需要の増加に対する Google の取り組みがかっこいい映像で紹介されます。

アフリカの開発者数

アフリカの開発者の半数はスタートアップで働いているらしいです。

アフリカのスタートアップの成長

世界には 500 万人の Flutter 開発者と 70 万以上の Flutter で作られたアプリがあるらしいです。すごい。

Flutter 自体へのコントリビューター数も GitHub 上で 3 番目に多いらしい。

Flutter の現状

Flutter3.7 のリリース

Flutter3.7

このイベントの少し前にリリースされた Flutter 3.7 で新しくなったことが紹介されました。

Material3 対応の進歩

RadioButton、Slider、Badge などを含むいくつかの Widget が Material3 に対応しました。 新たに対応された Widget は以下の通りです。

Adaptive layout 対応

デスクトップアプリや Web などで様々なサイズのスクリーンに動的に対応できるようになりました。

メニューバーとカスケードメニューへの対応

デスクトップアプリ開発で PlatformMenuBar を使うことでプラットフォーム用のメニューを表示することができるようになりました。

Impeller のプレビューが利用可能に

Skia に変わる Flutter の新しいレンダリングエンジンである Impeller はこれまで Flutter の master チャネルでしか利用できませんでしたが、3.7 からは stable チャネルでも利用できるようになりました。

Info.plist ファイルに以下のように追記すると iOS で利用可能になります。

  <key>FLTEnableImpeller</key>
  <true/>

Impeller は現在使われている Skia に比べて Flutter の iOS で問題になっている起動直後のアニーションへのカクツキの改善が期待できるようですが、あくまで現在はプレビュー版のようなので本番投入にはまだ慎重になった方が良さそうです。

iOS のリリースバリデーションが追加

iOS Release validation

flutter build ipa コマンドを作ってリリース用のアプリをビルドするときに、iOS アプリのリリース時チェックリストをもとにバリデーションを行なってくれるようになりました。 BundleID やアプリアイコンが正しく設定されているかを教えてくれます。これは便利そうですね。

DevTool の改善

Dev Tooll

メモリアロケーションが確認しやすくなったり、フレームごとのパフォーマンス解析できる機能が追加されたようです。 アプリのパフォーマンス改善がしやすくなりそう。


Flutter Forward で発表された変更点は以上でしたが、Medium の記事にはもっといろいろな改善点が書かれているのでぜひそちらも読んでみてください。

https://medium.com/flutter/whats-new-in-flutter-3-7-38cbea71133c

Flutter と Firebase を使ったアプリ開発のデモ

Firebase with flutter

実際のアプリ開発画面を表示しながら Firebase Auth を使ったサインインの実装のデモがありました。

Flutterflow の紹介

Flutterflow

Flutterflow の共同創業者二人による Flutterflow の紹介がありました。

Flutterflow はデザインツールから実際に動作する Flutter コードを生成できるノーコードアプリ開発ツールです。

データの取得などのロジックも扱えるようで、デモでは実際に NASA の API から情報を取得して表示していました。

GUI も使いやすそうだし必要に応じて Flutter のコードを書けるところが他のツールに比べていいなと思いました。

widgetbook の紹介

widgetbook

デザインカタログライブラリの widgetbook が紹介されました。

Web の Storybook のように Widget が確認できるだけでなく、Figma と連携することでデザインファイルと見比べながらレビューができるらしいです。

PUBG Mobile への導入事例

pubg mobile

PUBG Mobile はコミュニティ機能の実装に Flutter を利用しているそうです。 既存の PUBG Mobile アプリに対して Flutter の Add-to-app を利用しているみたいです。

Add-to-app は以前に比べてかなり安定してきた印象がありますが、PUBG くらいの規模のアプリへの導入事例があると今後利用の幅がさらに広がりそうですね。

Google Classroom への導入事例

Google classroom

Google Classroom は Android/iOS それぞれネイティブで書かれたアプリを Flutter にリプレイスすることで、同じ機能でも 66%のコード削減に成功したそうです。

Dart 3a の紹介

Flutter3.7 とともに Dart2.19 がリリースされましたが、次のメジャーリリースとなる Dart 3 のアルファ版が紹介されました。 個人的に今回のイベントの中で一番注目していたところです。

Record と Pattern の導入

pattern

Record(他の言語でいうとタプルのようなもの)と switch 文の仕様変更が予定されています。 これによって Dart でもパターンマッチングができるようになり、これまでよりも副作用の少ないコードが書けるようになりそうです。

100% null safety に

null safety

Dart2.12 で null safety がリリースされた後も、移行措置として null safety でないコードを書くことができましたが、導入から十分に時間が経過してライブラリの移行などもほとんど完了したことから、Dart3 からは完全に null safety になるそうです。

また、null チェックを をコンパイル時に行うことよってコンパイラの最適化も大きく進んだようで、Dart1 の頃は 26 行の機械語にコンパイルされていたシンプルな関数が、Dart2 では 10 行に、Dart3 ではさらに 3 行になるようです。すごい。

Dart1 Dart2 Dart3
Dart1 Compiler Dart2 Compiler Dart3 Compiler

Webassembly と RISC-V に対応

Dart の対応プラットフォーム

Dart がこれまでのアーキテクチャに加えて Webassembly と RISC-V に対応したようです。RISC-V の実際のマシンによるデモも行われました。

RISC-V のデモ

Flutter Web の最適化

Flutter Web の最適化

Wasm の導入による FlutterWeb の最適化が紹介されました。

Pixel shader

これまでの Flutter Web は Dart を JS にコンパイルして動作していましたが、JS の代わりに WASM にコンパイルすることによって、初回ロード時間やランタイムパフォーマンスが改善するそうです。

また Pixel Shader が Flutter Web に導入されたことにより、様々なグラフィックエフェクトが使えるようになる様子もデモで紹介されました。

News Tookit と Wonderous の紹介

Flutter のプロジェクト例として News Toolkit が紹介されました。サイトは以下にあります。

https://flutter.dev/news

Flutter のベストプラクティスを踏襲していて、コードの分量的にも実際のアプリと遜色ないくらいあるので、新しく Flutter プロジェクトを始めたい開発者が参考にするのにかなり良さそうです。

ロジック部分は Bloc を使っているようでした。

ffigen と jnigen

ffigen と jnigen

プラットフォームのネイティブコードを Dart から呼び出すための ffi を自動生成してくれるライブラリも紹介されました。 iOS 向けには ffigen、 Android 向けには jnigen を使うらしいです。

デモではヘルス機能へのアクセスが例に出されましたが、プラットフォーム依存のコードを書くのがだいぶ楽になりそうですね。

Impeller による 3D オブジェクトの描画

Flutter3.7 のアップグレードでも紹介された Impeller が再度紹介されました。 Impeller の導入によってパフォーマンス改善が期待できるだけでなく、glb ファイルを直接読み込んで 3D モデルを表示できるようにもなるみたいです。

flutter 3d

これができればゲームでの利用はもちろん 3D を使ったリッチなオンボーディングなどアプリ開発にも生かせそうですね。

まとめ

かなりざっくりまとめましたが、それでも盛りだくさんな内容でした。 Web アプリやデスクトップアプリなど Android/iOS のアプリ開発以外の用途に Flutter が使われるようになっていて、現実的な選択肢になってきたなと思いました。

今年は Dart3 のリリースも控えているので、次のイベントも楽しみです。