再コンポジションを理解する
ComposeがUIを更新する仕組みを学びます
「再コンポジションを理解する」はCoddyKit上の無料Android Academyレッスンです。 これはレッスン2/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはAndroid Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Android Academyコースには全4レッスンが含まれています。
再コンポジションとは
再コンポジションとは、読み取っているStateが変化したときに、ComposeがUIを更新するためコンポーザブル関数を再実行することです。これにより、画面とデータの同期が保たれます。
Stateの読み取りによって発生する
Composeは、どのコンポーザブルがどのStateを読み取るかを追跡します。Stateの値が変化すると、そのStateを読み取ったコンポーザブルだけが再コンポジションの対象になります。
スマートかつ選択的
再コンポジションは選択的に行われます。Composeは、必要な部分だけを再実行しようとします。Stateの一部が変化しても画面全体が再描画されるのではなく、そのStateに依存する部分だけが更新されます。
スキップ
コンポーザブルへの入力が変化していなければ、Composeはその再実行を完全にスキップできます。これにより、複雑な画面でも再コンポジションのコストを低く保てます。
コンポーザブルは頻繁に実行される
再コンポジションは頻繁に、また任意の順序で発生する可能性があります。そのため、コンポーザブルは安全に再実行できる必要があります。同じStateに対して何度呼び出しても、同じUIが生成されるようにしてください。
副作用を避ける
副作用(ネットワーク呼び出し、ファイルへの書き込み、共有変数の変更)をコンポーザブル本体で直接実行しないでください。再コンポジションのたびに実行される可能性があります。代わりにStateとエフェクトAPIを使用してください。
// BAD: runs on every recomposition
@Composable
fun Bad() {
saveToDatabase()
Text("Hi")
}実行順序に依存しない
コンポーザブルが特定の順序や特定のスレッドで実行されることを前提にしてはいけません。それぞれの呼び出しを独立したものとして扱ってください。この自由度があるからこそ、Composeは積極的に最適化できます。
読み取る場合と読み取らない場合
Stateが変化したときに再コンポジションされるのは、そのStateを読み取るコンポーザブルだけです。Textがcountを読み取らなければ、countを変更してもそのTextは影響を受けません。
@Composable
fun Demo() {
var count by remember { mutableStateOf(0) }
Text("Static") // never recomposes from count
Text("Count: $count") // recomposes when count changes
Button(onClick = { count++ }) { Text("+") }
}避けるべき再コンポジションループ
コンポジション中(イベント内ではない場所)にStateへ書き込むと、再コンポジションが無限ループする可能性があります。Stateの更新はonClickのようなコールバックからのみ行い、コンポーザブル本体から直接更新しないでください。
自動的に感じられる
開発者の視点では、再コンポジションは自動的に行われます。Stateに基づいてUIを宣言し、コールバックでStateを変更すれば、Composeが適切なコンポーザブルを再実行してくれます。
まとめて確認
このカウンターは再コンポジションを示しています。タップするとcountが変化し、Composeがそれを読み取るTextを再実行して、新しい数値を表示します。
@Composable
fun Counter() {
var count by remember { mutableStateOf(0) }
Button(onClick = { count++ }) {
Text(text = "Count: $count")
}
}クイックチェック
Composeはどのようなときにコンポーザブルを再コンポジションしますか?
まとめ
再コンポジションの要点:
- Stateが変化すると、そのStateを読み取るコンポーザブルが再実行されます。
- 再コンポジションは選択的に行われ、変化していないコンポーザブルはスキップできます。
- コンポーザブルは副作用を持たず、任意の順序で安全に再実行できる必要があります。
よくある質問
「再コンポジションを理解する」レッスンは無料ですか?
はい。「再コンポジションを理解する」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、Android Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Android Academyコースには全4レッスンが含まれています。
「再コンポジションを理解する」で何を学びますか?
ComposeがUIを更新する仕組みを学びます ブラウザで直接実行するハンズオンコードでAndroid Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
Android Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのAndroid Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン2/4です。
「再コンポジションを理解する」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このAndroid Academyレッスンでコードを書いて実行できますか?
はい。すべてのAndroid Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。