Jetpack Compose修改两个MutableState会触发两次重组吗？

我使用两个状态来处理动态弹窗组件：

var showPopUpScreen by remember { viewModel.popUpScreenIsOpen }
var popUpType by remember { viewModel.popUpScreenType }

打开弹窗时通过以下方法修改这两个MutableState的值：

fun OpenPopUpScreen(type: BasePopUpScreen) {
    popUpScreenType.value = type
    popUpScreenIsOpen.value = true
}

请问这会导致LiveTrainingScreen这个Composable函数执行两次（造成性能损耗），还是会被Compose智能合并仅触发一次弹窗渲染？补充代码如下：

fun LiveTrainingScreen(viewModel: LiveTrainingViewModel = viewModel()) {
// lots of code and then:
        var showPopUpScreen by remember { viewModel.popUpScreenIsOpen }
        var popUpType by remember { viewModel.popUpScreenType }

        //pop up container
        if(showPopUpScreen) {

            Row(modifier = Modifier
                .fillMaxSize()
                .background(Color.Black.copy(alpha = 0.6f))
                .zIndex(11f), verticalAlignment = Alignment.CenterVertically) {
                Column(modifier = Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally) {

                    DyanmicPopUpScreenLiveTraining(popUpScreenTypeInfo = popUpType, viewModel = viewModel)

                } // pop up main column

            } // end pop up screen row

        } // end if pop up screen
}

不会触发两次Composable执行，Compose会智能合并这两次状态更新，仅触发一次重组渲染。

核心原因 #

Jetpack Compose的状态更新采用帧内合并机制：当你在同一个同步调用流程中连续修改多个MutableState的值时，Compose不会立即触发重组，而是会收集所有状态变更，等到当前调用栈执行完成后，在同一个帧内一次性触发相关Composable的重组。

在你的OpenPopUpScreen函数中，修改popUpScreenType.value和popUpScreenIsOpen.value是同步连续操作，属于同一个调度周期内的变更，因此会被Compose合并处理。

结合代码分析 #

LiveTrainingScreen中只有当showPopUpScreen为true时才会渲染弹窗区域。当两个状态更新被合并后，重组时showPopUpScreen已经是true，且popUpType也已完成更新，因此弹窗会直接以正确的类型完成渲染，不会出现两次重组的情况，也就不存在额外的性能损耗。

内容的提问来源于stack exchange，提问作者Iets Iets