What problem does this feature solve?

<script>
    const { reactive, reactiveShallow, readonly, readonlyShallow, effect } = VueReactivity
    let state = reactive({ name: 10, age: 11 })
    effect(() => {
        console.log(“run effect”)
        document.getElementById('app').innerHTML = state.name + state.age
    })
    setTimeout(() => {
        state.name = 10010;
        state.age = 123123;
    }, 2000)
</script>

在执行 setTimeout中的 state.name = 10010; state.age = 123123;时，执行了两次effect。这样在一个函数中获取多个state的属性值，effect会执行多次，这样性能消耗比较大。

What does the proposed API look like?

effect(() => { console.log(“run effect”) document.getElementById('app').innerHTML = state.name + state.age },{await:true})

在一个函数获取多个state值时，同一个effect函数只执行一次。

建议在获取state的属性值时，每次获取把涉及到的effect存放在一个待执行队列，等多个state属性值获取完，（例如创建一个异步执行的函数专门执行effect的待执行队列，每次获取属性值时清除这个异步再启动新的定时器，直到短时间内没有去获取state的属性值）再去执行effect待执行队列。建议给effect函数添加创建这种effect的选项。

use a watch so changes are put together.

Please, next time consider using the forum, the Discord server or StackOverflow for questions first. But feel free to come back and open an issue if it turns out to be a bug 🙂