Jetpack Compose のパフォーマンス確認するための2つ公式のツール

その @Composable が compose/recomposeされるタイミング、把握したいですよね。

Google や Android 公式から公開されている2つのツールを使ってみましょう。

### サンプル

Button を使ったカウンターを ViewModel を使って作成します。

![1.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/588914/2916ef89-840d-46a4-7397-8196972d9d86.gif)
[👉 「Compose Compiler Reports」 recompose される条件とタイミングと範囲を知りたい](https://android.benigumo.com/20220719/recompose/)

### RecomposeHighlighter

シンプルな Modifier Extension Functionです。

視覚的に、recompose の処理の回数を確認できます。

[👉 RecomposeHighlighter.kt at master · android/snippets](https://github.com/android/snippets/blob/master/compose/recomposehighlighter/src/main/java/com/example/android/compose/recomposehighlighter/RecomposeHighlighter.kt)

```kotlin
  Button(
    onClick = onClick,
    modifier = Modifier.recomposeHighlighter() // *
  ) {
    Text("A: $count")
  }
```

![Reflector Recording.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/588914/ada46ade-b290-6598-8fab-ea857f9595a7.gif)
[👉 How can I debug recompositions in Jetpack Compose?](https://www.jetpackcompose.app/articles/how-can-I-debug-recompositions-in-jetpack-compose)



### ComposeCompilerReports/Metrics


> The Compose Compiler plugin can generate reports / metrics around certain compose-specific concepts that can be useful to understand what is happening with some of your compose code at a fine-grained level.

[👉 androidx/compiler-metrics.md at androidx-main · androidx/androidx](https://github.com/androidx/androidx/blob/androidx-main/compose/compiler/design/compiler-metrics.md)


```gradle
// build.gradle

 kotlinOptions {
  if (project.findProperty("composeCompilerReports") == "true") {
    freeCompilerArgs += [
        "-P",
        "plugin:androidx.compose.compiler.plugins.kotlin:reportsDestination=" +
            project.buildDir.absolutePath + "/compose_compiler"
    ]
  }
  if (project.findProperty("composeCompilerMetrics") == "true") {
    freeCompilerArgs += [
        "-P",
        "plugin:androidx.compose.compiler.plugins.kotlin:metricsDestination=" +
            project.buildDir.absolutePath + "/compose_compiler"
    ]
  }
}
```


```bash
./gradlew assembleRelease -PcomposeCompilerReports=true 
```

```bash
./gradlew assembleRelease -PcomposeCompilerMetrics=true
```

```
unstable class HomeViewModel {
  stable val _countState: MutableState<Int>
  stable val countState: State<Int>
  unstable val _countStateFlow: MutableStateFlow<Int>
  unstable val countStateFlow: StateFlow<Int>
  <runtime stability> = Unstable
}
```
```
restartable skippable scheme("[androidx.compose.ui.UiComposable]") fun HomeScreen(
  unstable viewModel: HomeViewModel? = @dynamic hiltViewModel(null, $composer, 0, 0b0001)
)
restartable skippable scheme("[androidx.compose.ui.UiComposable]") fun ButtonA(
  stable count: Int
  stable onClick: Function0<Unit>
)
```

```
{
 "skippableComposables": 103,
 "restartableComposables": 111,
 "readonlyComposables": 0,
 "totalComposables": 112,
 "restartGroups": 111,
 "totalGroups": 122,
 "staticArguments": 188,
 "certainArguments": 12,
 "knownStableArguments": 1116,
 "knownUnstableArguments": 17,
 "unknownStableArguments": 6,
 "totalArguments": 1139,
 "markedStableClasses": 0,
 "inferredStableClasses": 13,
 "inferredUnstableClasses": 8,
 "inferredUncertainClasses": 1,
 "effectivelyStableClasses": 13,
 "totalClasses": 22,
 "memoizedLambdas": 86,
 "singletonLambdas": 10,
 "singletonComposableLambdas": 39,
 "composableLambdas": 62,
 "totalLambdas": 109
}
```

### まとめ

少しづつ謎が明らかになって、すっきりしていきます。

[👉 「Compose Compiler Reports」 recompose される条件とタイミングと範囲を知りたい](https://android.benigumo.com/20220719/recompose/)
[👉 【Jetpack Compose】「Layout Inspector Recomposition counts」で re-compose 回数を確認する](https://android.benigumo.com/20220707/layout-inspector-recomposition-counts/)