Tweet
Tweet

Slide 1

Slide 1 text

Bitrise で Flutter アプリの CI を構築する際の勘所 Virtual Bitrise User Group Japan 2020 株式会社Hakali 取締役CTO 池内 孝啓 @iktakahiro 1

Slide 2

Slide 2 text

自己紹介 池内 孝啓 - Takahiro Ikeuchi 株式会社Hakali 取締役CTO Awarefy 事業部 開発 兼 事業責任者 @iktakahiro 好きな Bitrise Steps : Carthage, Firebase App Distribution 執筆書籍 : Python ユーザーのためのJupyter[実践]入門（技術評論社）, これからはじめる SQL入門（同）, ほか 2

Slide 3

Slide 3 text

発表の目的と概要 ● 目的 ○ Flutter x Bitrise 知見の共有 ● 概要 ○ Flutter 向けの CI を構築するうえでのポイントを ビルド中心にトピック毎に解説 3

Slide 4

Slide 4 text

毎日の気付きを増やす 心のセルフケア・アプリ 4 https://www.awarefy.app

Slide 5

Slide 5 text

Awarefy の機能と実装 5 チャットボット 独自実装！ チャート PlatformView オーディオ配信 パッケージ利用

Slide 6

Slide 6 text

6 Awarefyの技術スタック ● Dart + Flutter ● Swift, Kotlin ● Google Cloud Platform + Firebase ● Go, TypeScript, Python（Cloud Functions） ● Bitrise ⭐

Slide 7

Slide 7 text

Flutter を採用してみてわかったこと ● 非常に優れた DX（Dart, Pub.dev, Hot Reload, etc…) ● なんといっても両プラットフォーム対応 ● やっぱりネイティブ側のコードは書く（機能による） ● ビルドとリリースは各プラットフォームの機構に依存 => 申請フローの学習や環境設定・CI 構築は各々必要 7 ※ DX = Developer Experience

Slide 8

Slide 8 text

Bitrise で Flutter 向け CI を構築するにあたっての 勘所をお話しします！ 8

Slide 9

Slide 9 text

Bitrise x Flutter ー ビルド編 ー 9

Slide 10

Slide 10 text

10 最低限の設定は自動的に行われる GitHubリポジトリ内容の自動検知が便利

Slide 11

Slide 11 text

ビルドに関する統計 : Awarefyの場合 期間 : 2019年10月1日 〜 2020年5月28日 総ビルド回数 : 607回 実行時間（Standard Machine） : 約50分 実行時間（Elite Machine） : 約30分 11 ※ ビルド = Bitrise の Workflow の実行開始から完了までを指す ※ 諸事情によりキャッシュ無効 ※ 実行時間は直列に実行した場合の中央値で、ビルド失敗時のデータを除く

Slide 12

Slide 12 text

ビルド時間を占めるのは Flutter Build と Xcode Archive 12 Step Time Flutter Build (both) 27.8 min Xcode Archive 14.5 min Flutter Test 4.2 min Carthage 3.8 min Flutter Install 1.3 min Flutter Analyze 1.0 min Deploy to FAD (.apk) 27.55 sec Deploy to FAD (.ipa) 17.59 sec Total : 54.1min Machine : Standard

Slide 13

Slide 13 text

iOS 向けのビルドは Android 向けよりもおよそ 3倍 遅い 13 Step Time Flutter Build (apk) 5.5 min ※ 前ページのビルドとは別のビルドによる計測 Step Time Flutter Build (ios) 16.6 min Xcode Archive 14.5 min Android iOS

Slide 14

Slide 14 text

14 Elite Machine を利用するとおよそ 1.8倍 速くなる Step Time Flutter Build (both) 16.6 min Xcode Archive 6.6 min Carthage 2.2 min Total : 29min Machine : Elite ● Elite Machine の利用には For Teams プランが必須 ● 最低でも 3つの Concurrency 契約が必要 ● https://www.bitrise.io/pricing

Slide 15

Slide 15 text

Bitrise x Flutter ー ビルドの並列化編 ー 15

Slide 16

Slide 16 text

Flutter Build を各プラットフォームごとに 並列で実行すればいいのでは...？ 16

Slide 17

Slide 17 text

Bitrise (Start | Wait for) Build で Workflow を並列化 17 ● Workflow の Step から別の Workflow を呼び出す（複数可） ● Step から呼び出した別の Workflow の完了を待つ

Slide 18

Slide 18 text

18 iOS版 のみビルドする Workflow を 呼び出して並列実行

Slide 19

Slide 19 text

19 4.4 min 16.6 min 11.8 min Total : 43.1min Machine : Standard

Slide 20

Slide 20 text

Workflow の並列化で部分的には効率化可能 ● iOS 版のビルドを待つので、Total では数分短縮できる程度 ● 並列化した Workflow ごとに Flutter Install が必要になる => むしろオーバーヘッドが増えているとも言える ● Android 版を先行してデプロイするのには有効 20 ※ 紹介したビルドは短縮された例だが、直列と並列でほぼ変わらないこともある

Slide 21

Slide 21 text

補足 : Flutter の iOS ビルド = 遅い ではない ● [cloud_firestore] Xcode build extremely slow https://github.com/FirebaseExtended/flutterfire/issues/349 ● 特定のパッケージの利用有無や、Xcode や CocoaPods 関連の オプション指定で高速化できる余地が（ありそう） 21

Slide 22

Slide 22 text

Bitrise x Flutter ー アプリ配信（検証用） ー 22

Slide 23

Slide 23 text

Firebase App Distributor で検証端末に配信 23 ● Firebase を利用しているなら、おすすめ ● 両プラットフォーム対応 ● iOS 版は 証明書設定と UUID 登録必須

Slide 24

Slide 24 text

Bitrise x Flutter ー アプリ配信（ストア） ー 24

Slide 25

Slide 25 text

Google Play Store へのリリース 25 ● Play Console および GCP の設定でサービスアカウントを登録 ● 申請まで完結

Slide 26

Slide 26 text

App Store へのリリース 26 ● 中身は altool（Application Loaderの CLI） ● バイナリをアップするところまで ● 中身は fastlane ● バージョンの作成やメタデータの更新もでき、申請も可

Slide 27

Slide 27 text

Bitrise x Flutter ー 環境切り替え ー 27

Slide 28

Slide 28 text

Flatter では Flavor を利用して、対象の環境を切り替える 28 # Android Production env $ flutter build appbundle --release --flavor prod # Android Staging env $ flutter build apk --release --flavor staging ● Flutter Build の設定に各種指定を行う

Slide 29

Slide 29 text

補足 : Flavor に関する情報 ● 環境の切り替えは Bitrise 以前に準備が必要（特に Xcode） ● Build flavors in Flutter (Android and iOS) with different Firebase projects per flavor https://medium.com/@animeshjain/build-flavors-in-flutter-android-and-i os-with-different-firebase-projects-per-flavor-27c5c5dac10b 29

Slide 30

Slide 30 text

おわりに : 今日話したこと 30 ● Awarefy の事業や技術スタックのこと ● Bitrise x Flutter のビルド時間のこと ● Bitrise のビルド並列化のこと ● Bitrise からのアプリ配信に関すること