この記事は Anna-Chiara Bellini、Nick Butcher による Android Developers Blog の記事 "Announcing Jetpack Compose Beta!" を元に翻訳・加筆したものです。詳しくは元記事をご覧ください。
2021 年 2 月 24 日（日本時間 2 月 25 日）、Jetpack Compose のベータ版をリリースしました。新しい UI ツールキットである Jetpack Compose は、すべての Android プラットフォームでネイティブ アプリを高速かつ簡単に開発できるようにすることを目指して設計されています。Compose が提供するのは、最先端の宣言型 Kotlin API です。これにより、少ないコードで美しくレスポンシブなアプリを作ることができます。Compose は既存の Android アプリや Jetpack ライブラリに組み込めるので、Android のビューと Compose を組み合わせながら、自分のペースで採用できます。
今回のベータ版リリースで Compose の API は確定版になりました。これで本番向けのアプリを構築する際に必要な機能がすべてそろったことになります。ベータ版には、API が安定したという意味合いもあります。つまり、API が変更されたり、削除されたりすることはありません。Compose を学び始め、今後のプロジェクトや機能にどう活用するかについて計画を立てるには、今が絶好の機会です。Compose は今年中に 1.0 に到達する予定です。
Compose チームは、コミュニティの皆さんからのフィードバックも取り入れて、オープンに開発を進めています。2019 年に開発をオープンソース化して以来、30 回のパブリック リリースを行い、外部から寄せられた 700 個以上のバグに対応し、200 件以上の外部からのコントリビューションを受け入れました。皆さんに Compose を使ってアプリを開発していただくことはとても嬉しいことで、いただいたフィードバックや機能リクエストは API の微調整や作業の優先順位を付けることに役立っています。アルファ版リリース以降も、たくさんの機能を追加または改善しています。
ベータ版リリースでは、API の完全性を確保することに重点を置いています。つまり、1.0 やその先に向けて、土台となる API を提供することです。今後は、1.0 リリースに向けてこれらの API の機能を安定させる作業を進める予定です。アプリのパフォーマンスとユーザー補助機能には、特に重点を置いています。
最新の Android Studio Arctic Fox Canary 版は Compose ベータ版をサポートしており、たくさんの新しいツールも搭載しています。
🆕 ライブ リテラル: デバイスやエミュレータで、プレビューのリテラルをリアルタイムにアップデート🆕 アニメーション プレビュー: アニメーションの調査と再生🆕 Layout Inspector の Compose サポート🆕 インタラクティブ プレビュー: Composable を切り離して調査や操作が可能🆕 デプロイ プレビュー: アプリ全体をデプロイすることなく、デバイスに Composable をデプロイ
🆕 ライブ リテラル: デバイスやエミュレータで、プレビューのリテラルをリアルタイムにアップデート
🆕 アニメーション プレビュー: アニメーションの調査と再生
🆕 Layout Inspector の Compose サポート
🆕 インタラクティブ プレビュー: Composable を切り離して調査や操作が可能
🆕 デプロイ プレビュー: アプリ全体をデプロイすることなく、デバイスに Composable をデプロイ
Jetpack Compose は、Android ビューと共存してシームレスに動作するように設計されているので、自分のペースで採用できます。具体的には、Android ビューに Compose UI を埋め込んだり、Compose の中でビューを使ったりすることもできます。相互運用性に関するドキュメントに、たくさんの採用戦略をまとめました。
既存アプリに Compose を追加する際に役立つように、ビューとの相互運用性に加えて、よく使われるライブラリとの統合も行っています。そのため、アプリを書き直したり、アーキテクチャを変更したりする必要はありません。以下の統合が利用可能です。
MDC-Android Compose Theme Adapter ライブラリや Accompanist ライブラリを使えば Material および AppCompat のXML テーマとの統合機能を利用できるので、テーマを重複して定義する必要はありません。Accompanist は、よく使われるイメージ読み込みライブラリのラッパーも提供します。
Jetpack Compose は、 宣言型 UI ツールキットであり、現在のビューシステムからのパラダイム シフトです。つまり、記述するのは、アプリが特定の状態のときに UI がどのように見えるべきか であって、 どのように UI を生成するかではありません。アプリの状態が変わったときは、Compose によって UI がアップデートされるため、UI を操作して目的の状態に変更するという面倒でエラーが起こりやすい作業は必要なくなります。
また、Compose はすべて Kotlin で書かれているので、優れた言語機能を活用して、簡潔で強力かつ直感的な API を提供できます。たとえば、コルーチンを使うと、ジェスチャー、アニメーション、スクロールなど、はるかにシンプルな非同期 API を書くことができます。そのため、ジェスチャーに続いてアニメーションするなど、非同期イベントを組み合わせたコードを簡単に書けるようになります。キャンセルやクリーンアップはすべて構造化され、並列に行われます。
皆さんや皆さんのチームが Jetpack Compose に関するあらゆることを学習できるように、Jetpack Compose Pathway をアップデートしました。これは、動画やハンズオン Codelabs、重要なドキュメントを厳選した一覧であり、Compose を始める際に役立ちます。本日は、新しく作成またはアップデートしたガイド ドキュメントも公開します。たくさんのスクリーンキャストや新しい Animation Codelab を通じて、Compose で開発を始める方法を詳しく学ぶことができます。アーキテクチャ、ユーザー補助機能、テストに関するガイドから、アニメーション、リスト、Compose の思想に関する詳しい説明まで、作業をより早くするために役立つガイドも準備しました。
さらに、実際に動作する Compose をすぐに見てみたい方のために、8 つの公式サンプルアプリも提供しています。シンプルなものから複雑なものまで、すべて異なる API やユースケースを扱っています。詳しくは README をご覧ください。
Compose を始める準備ができ、賞品も獲得したい方は、#AndroidDevChallenge に挑戦してください。Jetpack Compose で優れたアプリをすばやく作成する技術を身につけられるよう、4 週間にわたって日本時間の木曜日朝、週単位のチャレンジを出題します。各チャレンジでは、「インサイトを開放する」をテーマに、アニメーションやマテリアル テーマ、Composable やリストなど、毎回 Compose の新しい領域を扱います。毎回のチャレンジの勝者に新しい賞品があり、Pixel 5 を含む 1000 個以上の賞品を準備しています*。2 月 25 日から始まっている第 1 週のチャレンジの詳細は、こちらをご覧ください。
Jetpack Compose はベータ版に到達し、1.0 に向けた確定版の API や機能が完成しています。アプリで Compose を採用した方は、ぜひフィードバックをお寄せください。Kotlin Slack の #compose チャンネルで行われているディスカッションへの参加もお待ちしています。
*毎週のチャレンジに新しい賞品が設定されています。Google Pixel 5 が賞品になる週で、Google Pixel 5 が利用できない国にお住まいの方には、同程度の価値がある電子ギフトカードをお送りします。詳しくは公式ルールをご覧ください。
Reviewed by Yuichi Araki - Developer Relations Team and Hidenori Fujii - Google Play Developer Marketing APAC
この記事は Chris Banes による Android Developers - Medium の記事 "Jetpack Compose — Before and after" を元に翻訳・加筆したものです。詳しくは元記事をご覧ください。
今年になってから、サンプル アプリTivi の UI を Jetpack Compose に徐々に移行していました。そして 2020 年 12 月第 2 週、移行作業の第一段階がほぼ完了しました。
今回のブログ投稿では、重要な指標の数値を振り返って比較し、Compose によって何が変わるのかを確認してみましょう。比較するのは、APK サイズ、ビルド速度、コードの行数です。
Compose の話題を進める前に、まずは簡単にアプリについて説明します。
Tivi はかなり細かくモジュール化されており、それぞれの UI の「画面」ごとに Gradle モジュール（ui-$NAME）があります。それぞれの画面は Fragment で実装され、メインアプリ モジュールでは AndroidX Navigation を使ってそれらを組み合わせています。
ナビゲーション グラフはディープリンク URI を使って実装されているので、ほとんどの Fragment はお互いのことを知りません。そのため、疎結合が保証されます。しかし、それよりも重要なことは、独立してコンパイルできるため、ビルドの並列化がしやすくなることでしょう。
Compose に移行する前の Tivi は、Android デベロッパーが利用できるありとあらゆるクールな UI を利用していました。一例をあげれば、データ バインディング、Epoxy、マテリアル デザイン コンポーネント、Insetter DBX、MotionLayout などです。しかし残念ながら、これらの大半ではアノテーション処理が使われているため、ビルドのコストがかかります。
先ほど、移行の「第一段階」を終えたばかりだと書きました。これはどういう意味でしょうか。2020 年 1 月にこの作業を始めたときから、アプリの見た目はほとんど変わっていません。
アプリがモジュール化されているということは、移行自体も部品単位になり、一度に 1 つの Fragment だけ移行できるということです。この 11 か月間はまさにそれを実践し、46 個のプル リクエストに対応しています。
最初に簡単な画面 Episode details を移行し、次に Show details、そして ‘Discover’、‘Search’、‘Followed shows’ と移行を進めました。最近追加された Compose の Paging3 サポートと合わせて、最後の画面となった ‘list’ グリッドを移行できました。
2020 年 12 月 10 日（日本時間 12 月 11 日）、アプリから AppCompat、マテリアル デザイン コンポーネント、その他の AndroidX ウィジェット ライブラリを削除する処理を始めました。これは、Tivi の UI が Compose ベースになったことを意味します。
Remove AppCompat + MDC by chrisbanes · Pull Request #737 · chrisbanes/tivi
アプリで Fragment と Navigation を使っている点は変わりませんが、論理的な次のステップは、Fragment から移行して直接新しい Navigation Compose コンポーネントを使うようになります。
この移行の過程は近日中に別のブログ記事で書きたいと思いますが、本投稿の最後の「まとめ」から、私自身の言葉を引用しておきます。
いろいろ考えなくても、Compose が Android の UI 開発の未来であることはわかります。
では、いくつかの指標を確認してみましょう。
以下のそれぞれの指標では、3 つのバージョンのアプリを比較します。
ユーザーが最も気にする指標は、APK サイズです。
以下の結果は、リソース圧縮を有効にし、R8 を使って最小化した release APK を APK Analyzer で測定したものです。
‘adjusted’（調整済み）の値と ‘Pre-Compose’ を比較すると、Compose を使った場合は APK サイズが 41%、メソッド数は 17% 削減されていることがわかります。
Compose を使った場合は、APK サイズが 41%、メソッド数は 17% 削減されていることがわかる
この数から、AppCompat や MDC などがアプリ内でどれほどの容量を占めているかがわかります。それだけではなく、レイアウト ファイルで使われる場合に備えてすべての View クラスを保持しなければならない場合には、最小化ツールはほとんど役に立たないこともわかります。
ソフトウェア プロジェクトを比較する場合、ソースの行数を数えても特に役立つ統計情報にはならないことは承知していますが、この比較によって、どのような変化が起きているのかは確実に把握できます。
このテストでは、cloc ツールで以下のコマンドを使い、すべてのビルドと生成されたファイル、設定ファイルを除外しました。
cloc . --exclude-dir=build,.idea,schemas
cloc ツールにはコメントを無視する機能が組み込まれているので（ただし、検証はしていません）、上記は実際の「コード」の結果です。当然ながら、XML の行数は大幅に少なくなり、76% 削減されています。レイアウト ファイル、スタイル、テーマなど、たくさんの XML ファイルとお別れできます。
同じように興味深いのは、Kotlin の合計行数も減っていることです。仮説としては、アプリ内のボイラープレートが減り、たくさんのビューヘルパーやユーティリティ コードを削除できたためだと考えられます。3,000 行近くを削除できたこちらの PR をご覧ください。
Remove a load of old code 🗑️ by chrisbanes · Pull Request #713 · chrisbanes/tivi
ビルド速度はデベロッパーの関心が非常に高い指標です。このプロセスを開始する前は、多くのアノテーション プロセッサを削除できることでビルド速度が向上するものと考えていましたが、どの程度かはよくわかりませんでした。
テストの設定
説明を続ける前に、以下の数値をどのようにして測定したのかを知っておくことが重要になります。ここでは、Chris Horner が異なる CPU でビルド速度を測定したときと同じ設定を使いました。
テストに使ったマシンは、192 GB の RAM と超高速な Xeon® Gold 6154 CPU を搭載した Lenovo P920 です。言うまでもなく、このマシンは一般的なデベロッパーの設定ではありません。そこで、現実に近いテストを行うため、CPU を最低クロック周波数に固定しました。
# Use performance governor to allow tweaking of max freq
sudo cpupower frequency-set -g performance
# Set max frequency to CPU minimum: 1.2GHz
sudo cpupower frequency-set -u 1.2GHz
その後、すべてのリモート アーティファクト キャッシュを準備するため、./gradlew assembleDebug を実行しました。
そして、テストを実行するため、次のコマンドをループで 5 回実行します。
./gradlew --profile \
--offline \
--rerun-tasks \
--max-workers=4 \
assembleDebug
厳密には --max-workers は必要ありませんが、この CPU では、デフォルトで Gradle が利用できる 64 個の「コア」のすべてが使われます。これを 4 に制限することで、通常のラップトップ CPU と比較しやすくします。
テスト結果は以下のとおりです。それぞれの結果プロファイル レポートの ‘Total Build Time’（合計ビルド時間）の値をご覧ください。
この結果にはかなり驚かされました。ほとんど数値が変わらなかったからです。予想では、多くのアノテーション プロセッサが削除されることで、‘Without view libs’（ビュー ライブラリなし）が大幅に速くなると思っていました。
結果の明細を見てみると、kapt の実行時間はすべて同じくらいでした。おそらくこれは、View Binding、Dagger/Hilt、Room の使用を継続しているためではないかと思います。
しかし、Kotlin コンパイラや Compose コンパイラ プラグインが行ってくれることを考えれば、ビルド時間が 5% 削減されたことに何も不満はありません。
これまでに説明してきた全ての結果に当てはまる注意点があります。
この 11 か月間、Tivi には何の機能も追加しませんでしたが、この点を厳密に制限したわけではありません。移行とはあまり関係のない部分で多くの変更を行っており、それが結果に影響した可能性もあります。
移行を行った 11 か月間で、多くの依存性が更新されました。ほとんどの依存性の更新はランタイム ライブラリの依存性だったので、APK サイズ指標に影響する可能性は低いはずです。
Gradle のアップデート（6.0.1 から 6.7.0）、Android Gradle Plugin のアップデート（3.6.0 から 4.2.0）、そして Kotlin のアップデート（1.3.61 から 1.4.20）などは、すべてビルド速度に大きな影響があります。
Compose は現在アルファ版なので、すべての成果物は開発中のスナップショットになります。来年 1.0 の安定版になったとき、これらのテストを再実行して違いが出るかを見るのが楽しみです。
結果と注意点を見る限り、リンゴ 🍎 とリンゴ 🍏 を比較しているわけではない（同じ条件で比較しているわけではない）ので、あまり多くの結論を出すべきではありません。これは、リンゴ 🍎 とそれよりも少し甘いナシ 🍐 を比べているようなものです。
果物の例はさておき、最大のポイントは Compose がほとんどのデベロッパー指標で良好な（または中立的な）影響を示していることです。この点と Compose でデベロッパーの生産性が大幅に向上することを踏まえれば、いろいろ考えなくても、Compose が Android の UI 開発の未来であることはわかります。
