Recompose 방법 바뀜 @Jetpack Compose

Jetpack Compose 라이브러리 업데이트에 따라 동작이 달라진 점이 있어서 이전에 출시한 앱이 제대로 작동하지 않는 문제가 있었다. 리스트 프로퍼티와 단순 프로퍼티를 예로 들어서 알아본다.

바뀐 recomposition 방법

이미 출시한 앱을 어느 날 컴파일해보았다. 앱 출시 이후에 여러 라이브러리가 업데이트되었으니까 앱 구성이 새 라이브러리와 잘 맞는지 확인이 필요하다. 이번에 targetSdk = 35 를 적용하는 김에 이전 앱에도 다 적용해야겠다는 생각을 했는데 그 와중에 문제점이 발견되었다.

컴파일은 잘 됐다. 그런데 왜 화면 갱신이 제대로 안 되지? 클릭하는대로 산출된 결과가 쭉쭉 나와줘야 하는데 안 돼 버린다. AI 한테 조언을 받아보니까 지난 몇 달 사이에 Jetpack Compose 에 내가 체감할만한 변화가 있었다.

일 년 전에 강제로 recompose 하는 방법에 관한 글을 썼었다:
https://hhtt.kr/102997 (Korean)
https://hhtt.kr/103009 (English)
지금도 일부 상황에서는 이 방법이 유효하다. 그런데 적용 안 되는 상황도 있었다. 값이 갱신되는 상황에서는 안 먹혔다.

값이 자동 갱신되게 하는 방법

List property

이 방법이 언제부터 있었는지는 모르겠다. 아무튼 나는 얼마전에야 알았다. 전에는 다음과 같이 해도 이 값이 바뀔 때마다 Composable 에서 값이 잘 갱신되었다. 잘 안 될 때는 지난 번에 쓴 저 글의 방법으로 강제 갱신하면 잘 되었다.

data class MyUiState(
    val myList: MutableList<Int> = mutableListOf(),
)

ChatGPT 는 이걸 다음과 같이 바꾸라고 했다:

data class MyUiState(
    val myList: SnapshotStateList<Int> = mutableStateListOf(),
)

그 이후 갱신이 잘 됐다. .add() 함수 등 적용하는 것은 MutableList 와 똑같았다. 그러니 코드를 그리 많이 수정하지 않아도 됐다.

단순 프로퍼티

단순 프로퍼티도 전에는 그냥 이렇게 해 놨었다.:

data class MyUiState(
    val myValue: Int = 0,
)

이것도 이렇게 바꾸라고 한다:

data class MyUiState(
    var myValue: MutableState<Int> = mutableStateOf(0)
)

지금 보니 단순 프로퍼티는 나도 다 이렇게 바꾸지는 않았다(리스트는 많이 바꿈). 뭐 안 될 때 있으면 바꿔야겠다. Composable 에 출력하는 것들은 다 바꾸긴 해야겠다. 이때는 값 수정할 때도 .copy() 함수를 안 쓰고 이렇게 한다:

uiState.myValue.value = index

종합

MutableList 프로퍼티, 단순 프로퍼티를 다음과 같이 바꾸면 recompose 문제가 덜 생길 것이다. 특히 Composable 에서 불러서 출력해야 할 프로퍼티는 다 이렇게 바꾸면 좋겠다:

data class MyUiState(
    val myList: SnapshotStateList<Int> = mutableStateListOf(),
    var myValue: MutableState<Int> = mutableStateOf(0)
)